Ember-CLI:找不到模块'broccoli-static-compiler'错误:无法找到模块'broccoli-static-compiler'

Gra*_*pho 4 ember.js ember-cli

谁知道这个错误意味着什么?最重要的是:如何解决?

Cannot find module 'broccoli-static-compiler'Error: Cannot find module 'broccoli-static-compiler'

这是在安装ember-cli新项目并尝试运行之后发生的 ember server

Jer*_*oek 5

这意味着ember serve找不到Node.js包broccoli-static-compiler。Broccoli为Ember CLI项目提供了构建管道,这broccoli-static-compiler是一个Broccoli插件,可将文件原样复制到构建输出中。

我不能与Ember CLI重现此0.0.280.0.29,这个包应该是可用的YOURPROJECT/node_modules/ember-cli/node_modules/。您安装了哪个版本的Ember CLI?(ember --version

您可以尝试broccoli-static-compiler通过npm install --save-dev broccoli-static-compiler从项目目录运行在本地为新项目安装自己。


gre*_*ott 5

西兰花静态编译器

(1)安装所需的西兰花扩展:

npm install --save-dev broccoli-static-compiler
npm install --save-dev broccoli-merge-trees
Run Code Online (Sandbox Code Playgroud)

(2)编辑Brocfile.js.

删除或评论此行:

module.exports = app.toTree();
Run Code Online (Sandbox Code Playgroud)

添加(并修改以适应):

// require the static compiler
var pickFiles = require('broccoli-static-compiler');
// choose the static files - path usually: 'vendor/module/dist'
var iCanHasFiles = pickFiles('path/to/files', {
    srcDir: '/',
    // 'files' is optional for choosing some of the srcDir's content.
    // NB: Do not include directories here!
    files: ['file.js', 'file.css', 'file.woff'],
    destDir: '/assets/icanhasfiles'
});

// Merge the iCanHasFiles with the ember app tree
var mergeTrees = require('broccoli-merge-trees');
module.exports = mergeTrees([app.toTree(), iCanHasFiles]);
Run Code Online (Sandbox Code Playgroud)

(3)其他JavaScript文件也可以通过这个文件添加.它们必须插入到Brocfile.js中的module.exports调用之上.

// after "bower install --save bower-module-name" (bower.io/search for name).
app.import('vendor/module/file.js');
Run Code Online (Sandbox Code Playgroud)

Ember-cli和Bootstrap

(A)使用Bootstrap包含创建新项目应用项目的说明:

ember new app-project
cd app-project
bower install --save bootstrap-sass-official
npm install --save-dev broccoli-sass
mv app/styles/app.css app/styles/app.scss
Run Code Online (Sandbox Code Playgroud)

(B)打开app/styles/app.scss,并更改导入路径:

@import 'vendor/bootstrap-sass-official/vendor/assets/stylesheets/bootstrap';
Run Code Online (Sandbox Code Playgroud)

(C)要包含Glyphicons字体,请打开Brocfile.js:

// import the necessary modules:
var pickFiles = require('broccoli-static-compiler');
var mergeTrees = require('broccoli-merge-trees');

// at the bottom of the file, replace the "module.exports" line with:
// module.exports = app.toTree();

// Put the bootstrap fonts in the place that the bootstrap css expects to find them.
var bootstrapFonts = pickFiles('vendor/bootstrap-sass-official/vendor/assets/fonts/bootstrap', {
    srcDir: '/',
    destDir: '/assets/bootstrap'
});

// Merge the bootstrapFonts with the ember app tree
var mergeTrees = require('broccoli-merge-trees');
module.exports = mergeTrees([
    app.toTree(),
    bootstrapFonts
]);
Run Code Online (Sandbox Code Playgroud)

(D)或者,对于经典的glyphicons(bootstrap 2.3等):

// if using glyphicons instead (bootstrap 2.3 etc):
var glyphicons = pickFiles('vendor/bootstrap-sass-official/vendor/assets/fonts/bootstrap', {
    srcDir: '/',
    files: [
        'glyphicons-halflings-regular.*',
    ],
    destDir: '/assets/bootstrap'
});

// Merge the glyphicons with the ember app tree
module.exports = mergeTrees([
    app.toTree(),
    glyphicons
]);
Run Code Online (Sandbox Code Playgroud)