Fatal编程技术网
  • angular/
  • 用angular 2、angular CLI和西兰花设置LESSCS

用angular 2、angular CLI和西兰花设置LESSCS

angular less

用angular 2、angular CLI和西兰花设置LESSCS,angular,less,angular-cli,broccolijs,Angular,Less,Angular Cli,Broccolijs,我正在尝试使用angular 2和angular CLI和西兰花设置lesscss 我在angular CLI的github上打开了一个问题： 如果在我的项目上安装了less，我会系统地得到以下错误： ng build Could not start watchman; falling back to NodeWatcher for file system events. Visit http://ember-cli.com/user-guide/#watchman for more info

我正在尝试使用angular 2和angular CLI和西兰花设置lesscss

我在angular CLI的github上打开了一个问题：

如果在我的项目上安装了less，我会系统地得到以下错误：

ng build 
Could not start watchman; falling back to NodeWatcher for file system events.
Visit http://ember-cli.com/user-guide/#watchman for more info.
Build failed.
File: input (1029)
The Broccoli Plugin: [LESSPlugin] failed with:
undefined

The broccoli plugin was instantiated at: 
    at LESSPlugin.Plugin (/Users/julien/Documents/projects/bignibou/bignibou-client/node_modules/angular-cli/node_modules/broccoli-plugin/index.js:10:31)
    at LESSPlugin.CachingWriter [as constructor] (/Users/julien/Documents/projects/bignibou/bignibou-client/node_modules/angular-cli/node_modules/broccoli-caching-writer/index.js:21:10)
    at new LESSPlugin (/Users/julien/Documents/projects/bignibou/bignibou-client/node_modules/angular-cli/lib/broccoli/angular-broccoli-less.js:21:12)
    at Object.Plugin.build.compile.exports.makeBroccoliTree (/Users/julien/Documents/projects/bignibou/bignibou-client/node_modules/angular-cli/lib/broccoli/angular-broccoli-less.js:52:12)
    at Angular2App._buildTree (/Users/julien/Documents/projects/bignibou/bignibou-client/node_modules/angular-cli/lib/broccoli/angular2-app.js:133:27)
    at new Angular2App (/Users/julien/Documents/projects/bignibou/bignibou-client/node_modules/angular-cli/lib/broccoli/angular2-app.js:53:23)
    at module.exports (/Users/julien/Documents/projects/bignibou/bignibou-client/angular-cli-build.js:10:10)
    at Class.module.exports.Task.extend.setupBroccoliBuilder (/Users/julien/Documents/projects/bignibou/bignibou-client/node_modules/angular-cli/node_modules/angular-cli/lib/models/builder.js:55:19)
    at Class.module.exports.Task.extend.init (/Users/julien/Documents/projects/bignibou/bignibou-client/node_modules/angular-cli/node_modules/angular-cli/lib/models/builder.js:89:10)
    at new Class (/Users/julien/Documents/projects/bignibou/bignibou-client/node_modules/angular-cli/node_modules/core-object/core-object.js:18:12)
    at Class.module.exports.Task.extend.run (/Users/julien/Documents/projects/bignibou/bignibou-client/node_modules/angular-cli/node_modules/angular-cli/lib/tasks/build.js:15:19)
    at /Users/julien/Documents/projects/bignibou/bignibou-client/node_modules/angular-cli/node_modules/angular-cli/lib/commands/build.js:32:24
    at lib$rsvp$$internal$$tryCatch (/Users/julien/Documents/projects/bignibou/bignibou-client/node_modules/angular-cli/node_modules/rsvp/dist/rsvp.js:1036:16)
    at lib$rsvp$$internal$$invokeCallback (/Users/julien/Documents/projects/bignibou/bignibou-client/node_modules/angular-cli/node_modules/rsvp/dist/rsvp.js:1048:17)
    at /Users/julien/Documents/projects/bignibou/bignibou-client/node_modules/angular-cli/node_modules/rsvp/dist/rsvp.js:331:11
    at lib$rsvp$asap$$flush (/Users/julien/Documents/projects/bignibou/bignibou-client/node_modules/angular-cli/node_modules/rsvp/dist/rsvp.js:1198:9)
这是我的angular cli build.js：

var Angular2App = require('angular-cli/lib/broccoli/angular2-app');

module.exports = function (defaults) {
  return new Angular2App(defaults, {
    vendorNpmFiles: [
      'systemjs/dist/system-polyfills.js',
      'systemjs/dist/system.src.js',
      'zone.js/dist/**/*.+(js|js.map)',
      'es6-shim/es6-shim.js',
      'reflect-metadata/**/*.+(ts|js|js.map)',
      'rxjs/**/*.+(js|js.map)',
      '@angular/**/*.+(js|js.map)',
      'ng2-bootstrap/**/*',
      'ng2-translate/**/*.+(js|js.map)',
      'angular2-moment/**/*.+(js|js.map)',
      'moment/**/*.+(js|js.map)'
    ],
    lessCompiler: {
      'paths': [__dirname + '/src']
    }
  });
};

<!doctype html>
<html>
<head>
  <meta charset="utf-8">
  <title>Bignibou Client</title>
  <base href="/">

  <!--TODO: remove once ng CLI less plugin works-->
  <link rel="stylesheet" href="assets/styles/style.css"/>

  {{#unless environment.production}}
  <script src="/ember-cli-live-reload.js" type="text/javascript"></script>
  {{/unless}}
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="icon" type="image/x-icon" href="favicon.ico">
</head>
<body>
<main>Loading...</main>

{{#each scripts.polyfills}}
<script src="{{.}}"></script>
{{/each}}
<script>
  System.import('system-config.js').then(function () {
    System.import('main');
  }).catch(console.error.bind(console));
</script>



</body>
</html>
此外，我不确定从何处以及如何从引导css框架导入/包含较少的源文件

这是我的index.html：

var Angular2App = require('angular-cli/lib/broccoli/angular2-app');

module.exports = function (defaults) {
  return new Angular2App(defaults, {
    vendorNpmFiles: [
      'systemjs/dist/system-polyfills.js',
      'systemjs/dist/system.src.js',
      'zone.js/dist/**/*.+(js|js.map)',
      'es6-shim/es6-shim.js',
      'reflect-metadata/**/*.+(ts|js|js.map)',
      'rxjs/**/*.+(js|js.map)',
      '@angular/**/*.+(js|js.map)',
      'ng2-bootstrap/**/*',
      'ng2-translate/**/*.+(js|js.map)',
      'angular2-moment/**/*.+(js|js.map)',
      'moment/**/*.+(js|js.map)'
    ],
    lessCompiler: {
      'paths': [__dirname + '/src']
    }
  });
};

<!doctype html>
<html>
<head>
  <meta charset="utf-8">
  <title>Bignibou Client</title>
  <base href="/">

  <!--TODO: remove once ng CLI less plugin works-->
  <link rel="stylesheet" href="assets/styles/style.css"/>

  {{#unless environment.production}}
  <script src="/ember-cli-live-reload.js" type="text/javascript"></script>
  {{/unless}}
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <link rel="icon" type="image/x-icon" href="favicon.ico">
</head>
<body>
<main>Loading...</main>

{{#each scripts.polyfills}}
<script src="{{.}}"></script>
{{/each}}
<script>
  System.import('system-config.js').then(function () {
    System.import('main');
  }).catch(console.error.bind(console));
</script>



</body>
</html>


Bignibou客户端
{{{#除非环境.生产}
{{/除非}
加载。。。
{{{#each scripts.polyfills}
{{/每个}}
导入（'System-config.js'）。然后（函数（）{
系统导入（'main'）；
}).catch（console.error.bind（console））；
有人能帮忙吗