2016-08-05 86 views
2

我運行此:無法在Angular2中安裝Underscore?角-CLI

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

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

system-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/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) 

我做錯了什麼?

+0

你編輯build.js文件後運行NG構建? –

+0

是的,我做了,看到我的新答案如下: – Vicheanak

+0

確保你有正確的參考類型和,不要張貼在答案,編輯你的問題,並在那裏添加 –

回答

0

我在自己如此瘋狂,答案是:

src/app/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() 
    } 
}