Question

Brunch的全新（以及种类的凉亭）。我通过凉亭安装了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/

我没有将任何bootstrap css导入我的app.css。但是，它显示了app.js中的js。不确定可能出现的问题。

Answer 1

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

e.g。作为bower依赖项的Bootstrap不会导出.css样式表，而是使用Less。不幸的是，早午餐不会编译.less文件而不会少吃早餐。

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

因此，有两种解决方案：

1

只需安装少早午餐

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

Answer 2

不要忘记通过bower.json告诉早午餐关于它的凉亭依赖关系的例子：

{
  "name": "your-app",
  "version": "0.0.1",
  "main": "www/app.js",
  "dependencies": {
    "bootstrap": ">=3.2.0"
  },
  "overrides": {}
}

Answer 3

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

npm install css-brunch --save-dev

早午餐不通过bower.js拉入Bootstrap

3 个答案:

因此，有两种解决方案：

1

2