Question

我跑了这个：

npm install underscore --save
typings install dt~underscore --global --save
ng build

角-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)',
      'moment/moment.js',
      '@angular2-material/**/*.js',
      'ng2-bootstrap/**/*.js',
      'underscore/underscore.js'
    ]
  });
};

系统config.js

var map = {
    'moment': 'vendor/moment/moment.js',
    '@angular2-material': 'vendor/@angular2-material',
    'ng2-bootstrap': 'vendor/ng2-bootstrap',
    'underscore': 'vendor/underscore/underscore.js'
};
/** User packages configuration. */
var packages = {
    'moment': {
        format: 'cjs'
    },
    '@angular2-material/core': {
        format: 'cjs',
        defaultFormat: 'js',
        main: 'core.js'
    },
    '@angular2-material/checkbox': {
        format: 'cjs',
        defaultFormat: 'js',
        main: 'checkbox.js'
    },
    'ng2-bootstrap': {
        format: 'cjs',
        defaultFormat: 'js',
        main: 'ng-bootstrap.js'
    },
    'underscore': {
        format: 'cjs'
    }
};

的src /应用程序/ app.component.ts

//Place this at the top near your imports
/// <reference path="../../typings/globals/underscore/index.d.ts" />
import { Component } from '@angular/core';
import * as moment from 'moment';
import {MdCheckbox} from '@angular2-material/checkbox';
import {AlertComponent} from 'ng2-bootstrap/ng2-bootstrap';
import * as _ from 'underscore';

@Component({
  moduleId: module.id,
  selector: 'app-root',
  templateUrl: 'app.component.html',
  styleUrls: ['app.component.css'],
  directives: [MdCheckbox, AlertComponent]
})
export class AppComponent {
  title = moment().format();
  _.each([1, 2, 3], alert);
}

当我运行ng serve

时

我收到了这个错误：

(node:30330) fs: re-evaluating native module sources is not supported. If you are using the graceful-fs module, please update it to a more recent version.
Could not start watchman; falling back to NodeWatcher for file system events.
Visit http://ember-cli.com/user-guide/#watchman for more info.
Livereload server on http://localhost:49152
Serving on http://localhost:4200/
The Broccoli Plugin: [BroccoliTypeScriptCompiler] failed with:
Error: Typescript found the following errors:
  /Users/Roller/Working/Web/sp/tmp/broccoli_type_script_compiler-input_base_path-GYZavJUx.tmp/0/src/app/app.component.ts (18, 4): ';' expected.
  /Users/Roller/Working/Web/sp/tmp/broccoli_type_script_compiler-input_base_path-GYZavJUx.tmp/0/src/app/app.component.ts (18, 11): Array element destructuring pattern expected.
  /Users/Roller/Working/Web/sp/tmp/broccoli_type_script_compiler-input_base_path-GYZavJUx.tmp/0/src/app/app.component.ts (18, 14): Parameter declaration expected.
  /Users/Roller/Working/Web/sp/tmp/broccoli_type_script_compiler-input_base_path-GYZavJUx.tmp/0/src/app/app.component.ts (18, 15): ';' expected.
  /Users/Roller/Working/Web/sp/tmp/broccoli_type_script_compiler-input_base_path-GYZavJUx.tmp/0/src/app/app.component.ts (18, 18): ';' expected.
  /Users/Roller/Working/Web/sp/tmp/broccoli_type_script_compiler-input_base_path-GYZavJUx.tmp/0/src/app/app.component.ts (18, 19): Unexpected token. A constructor, method, accessor, or property was expected.
  /Users/Roller/Working/Web/sp/tmp/broccoli_type_script_compiler-input_base_path-GYZavJUx.tmp/0/src/app/app.component.ts (18, 26): ';' expected.
  /Users/Roller/Working/Web/sp/tmp/broccoli_type_script_compiler-input_base_path-GYZavJUx.tmp/0/src/app/app.component.ts (18, 10): A parameter initializer is only allowed in a function or constructor implementation.
    at BroccoliTypeScriptCompiler._doIncrementalBuild (/Users/Roller/Working/Web/sp/node_modules/angular-cli/lib/broccoli/broccoli-typescript.js:120:19)
    at BroccoliTypeScriptCompiler.build (/Users/Roller/Working/Web/sp/node_modules/angular-cli/lib/broccoli/broccoli-typescript.js:43:10)
    at /Users/Roller/Working/Web/sp/node_modules/angular-cli/node_modules/broccoli-caching-writer/index.js:152:21
    at lib$rsvp$$internal$$tryCatch (/Users/Roller/Working/Web/sp/node_modules/angular-cli/node_modules/rsvp/dist/rsvp.js:1036:16)
    at lib$rsvp$$internal$$invokeCallback (/Users/Roller/Working/Web/sp/node_modules/angular-cli/node_modules/rsvp/dist/rsvp.js:1048:17)
    at lib$rsvp$$internal$$publish (/Users/Roller/Working/Web/sp/node_modules/angular-cli/node_modules/rsvp/dist/rsvp.js:1019:11)
    at lib$rsvp$asap$$flush (/Users/Roller/Working/Web/sp/node_modules/angular-cli/node_modules/rsvp/dist/rsvp.js:1198:9)
    at _combinedTickCallback (internal/process/next_tick.js:67:7)
    at process._tickCallback (internal/process/next_tick.js:98:9)

The broccoli plugin was instantiated at:
    at BroccoliTypeScriptCompiler.Plugin (/Users/Roller/Working/Web/sp/node_modules/angular-cli/node_modules/broccoli-plugin/index.js:10:31)
    at BroccoliTypeScriptCompiler.CachingWriter [as constructor] (/Users/Roller/Working/Web/sp/node_modules/angular-cli/node_modules/broccoli-caching-writer/index.js:21:10)
    at BroccoliTypeScriptCompiler (/Users/Roller/Working/Web/sp/node_modules/angular-cli/lib/broccoli/broccoli-typescript.js:27:5)
    at Angular2App._getTsTree (/Users/Roller/Working/Web/sp/node_modules/angular-cli/lib/broccoli/angular2-app.js:331:18)
    at Angular2App._buildTree (/Users/Roller/Working/Web/sp/node_modules/angular-cli/lib/broccoli/angular2-app.js:124:23)
    at new Angular2App (/Users/Roller/Working/Web/sp/node_modules/angular-cli/lib/broccoli/angular2-app.js:53:23)
    at module.exports (/Users/Roller/Working/Web/sp/angular-cli-build.js:10:10)
    at Class.module.exports.Task.extend.setupBroccoliBuilder (/Users/Roller/Working/Web/sp/node_modules/angular-cli/node_modules/angular-cli/lib/models/builder.js:55:19)
    at Class.module.exports.Task.extend.init (/Users/Roller/Working/Web/sp/node_modules/angular-cli/node_modules/angular-cli/lib/models/builder.js:89:10)
    at new Class (/Users/Roller/Working/Web/sp/node_modules/angular-cli/node_modules/core-object/core-object.js:18:12)
    at Class.module.exports.Task.extend.run (/Users/Roller/Working/Web/sp/node_modules/angular-cli/node_modules/angular-cli/lib/tasks/serve.js:15:19)
    at /Users/Roller/Working/Web/sp/node_modules/angular-cli/node_modules/angular-cli/lib/commands/serve.js:64:24
    at lib$rsvp$$internal$$tryCatch (/Users/Roller/Working/Web/sp/node_modules/angular-cli/node_modules/rsvp/dist/rsvp.js:1036:16)
    at lib$rsvp$$internal$$invokeCallback (/Users/Roller/Working/Web/sp/node_modules/angular-cli/node_modules/rsvp/dist/rsvp.js:1048:17)
    at /Users/Roller/Working/Web/sp/node_modules/angular-cli/node_modules/rsvp/dist/rsvp.js:331:11
    at lib$rsvp$asap$$flush (/Users/Roller/Working/Web/sp/node_modules/angular-cli/node_modules/rsvp/dist/rsvp.js:1198:9)

我做错了什么？

Answer 1

我对自己很生气，答案是：

的src /应用程序/ app.component.ts

export class AppComponent {
  title = moment().format();
  _.each([1, 2, 3], alert); // <-- Wrong!
  ngOnInit(){
     _.each([1, 2, 3], alert); //<-- This works! Must put it in ngOnInit()
  }
}

无法在Angular2中安装Underscore？角-CLI

1 个答案: