ember.js - Ember-CLI：找不到模块“broccoli-static-compiler”错误：找不到模块“broccoli-static-compiler”

Question

有谁知道这个错误是什么意思？最重要的是：如何解决？

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

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

Answer 1

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

我无法用 Ember CLI 重现这个0.0.28，0.0.29这个包应该可以在YOURPROJECT/node_modules/ember-cli/node_modules/. 您安装了哪个版本的 Ember CLI？( ember --version)

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

Answer 2

Broccoli 静态编译器

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

npm install --save-dev broccoli-static-compiler
npm install --save-dev broccoli-merge-trees

(2) 编辑Brocfile.js。

删除或评论这一行：

module.exports = app.toTree();

添加（并修改以适应）：

// 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]);

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

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

Ember-cli 和 Bootstrap

(A) 创建包含 Bootstrap的新项目app-project的说明：

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

(B) 打开app/styles/app.scss，修改导入路径：

@import 'vendor/bootstrap-sass-official/vendor/assets/stylesheets/bootstrap';

(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
]);

(D) 或者，对于经典字形图标（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
]);