早午餐不拉在Bootstrap通过鲍尔.js

Question

对Brunch来说是全新的体验。我通过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。然而，它在app.js中显示了js。不知道哪里出了问题

Answer 1

问题在于。

。Bootstrap作为底层依赖并不导出。css样式表，而是使用Less。不幸的是，如果没有less-brunch, brunch将无法编译。less文件。

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

所以，有两个解决方案:

1。

直接安装less-brunch

npm install less-brunch --save

---

2。

覆盖主程序中的依赖项配置。

  "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告诉brunch它的底层依赖。json的例子:

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

Answer 3

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

npm install css-brunch --save-dev