3

全新的早午餐(和凉亭)。我通过 bower 安装了 Bootstrap,并且我有以下早午餐配置文件:

exports.config =
  # See http://brunch.io/#documentation for docs.
  files:
    javascripts:
      joinTo: 'app.js': /^(app|vendor|bower_components)/
      order:
        before: [
          'bower_components/jquery/jquery.js'
          'bower_components/handlebars/handlebars.js'
          'bower_components/ember/ember.js'
          'bower_components/ember-data-shim/ember-data.js'
          'bower_components/bootstrap/dist/js/bootstrap.js'
        ]
    stylesheets:
      joinTo: 'app.css': /^(app|vendor|bower_components)/
    templates:
      precompile: true
      root: 'templates'
      joinTo: 'app.js': /^app/

我没有将任何引导 css 放入我的app.css. 但是,它显示了 .js 中的 js app.js。不太确定可能出了什么问题。

4

3 回答 3

2

问题是 bower_components 依赖文件夹中的 bower.json 配置。

例如Bower 依赖的Bootstrap 不会导出.css 样式表,而是使用Less。不幸的是,brunch 不会在没有 less-brunch 的情况下编译 .less 文件。

  "main": [
    "less/bootstrap.less",
    "dist/js/bootstrap.js"
  ]

所以,有2个解决方案:

1.

只需安装 less-brunch

npm install less-brunch --save

2.

覆盖主 bower.json 中的依赖项配置,告诉 bower 导出 .css 样式表。

  "dependencies": {
    "bootstrap": "^3.3.6"
  },
  "overrides": {
    "bootstrap": {
      "main": [
        "dist/css/bootstrap.css",
        "dist/js/bootstrap.js"
      ]
    }
  }

现在你应该在 app.css 中导入所有依赖项

记得安装 css-brunch

npm install css-brunch --save
于 2016-03-14T21:05:09.117 回答
1

不要忘记通过 bower.json 示例告诉早午餐它的 bower 依赖项:

{
  "name": "your-app",
  "version": "0.0.1",
  "main": "www/app.js",
  "dependencies": {
    "bootstrap": ">=3.2.0"
  },
  "overrides": {}
}
于 2014-06-28T00:06:48.027 回答
0

在遵循早午餐指南时,我遇到了同样的问题。我没有安装早午餐 CSS 插件的问题。使用npm安装css-brunch

npm install css-brunch --save-dev
于 2015-06-04T09:52:44.103 回答