2016-07-13 12 views
1

私はAngle 2 CLIアプリケーションに瞬間を加えようとしています。Angular CLIアプリケーションにサードパーティのライブラリを追加する

私はここの指示に従いました:Official Angular CLI instructions。ここで

は私のpackage.jsonである:ここでは

{ 
    "name": "bignibou-client-new", 
    "version": "0.0.0", 
    "license": "MIT", 
    "angular-cli": {}, 
    "scripts": { 
    "start": "ng serve", 
    "postinstall": "typings install", 
    "lint": "tslint \"src/**/*.ts\"", 
    "test": "ng test", 
    "pree2e": "webdriver-manager update", 
    "e2e": "protractor" 
    }, 
    "private": true, 
    "dependencies": { 
    "@angular/common": "2.0.0-rc.4", 
    "@angular/compiler": "2.0.0-rc.4", 
    "@angular/core": "2.0.0-rc.4", 
    "@angular/forms": "0.2.0", 
    "@angular/http": "2.0.0-rc.4", 
    "@angular/platform-browser": "2.0.0-rc.4", 
    "@angular/platform-browser-dynamic": "2.0.0-rc.4", 
    "@angular/router": "3.0.0-beta.2", 
    "angular2-moment": "^0.8.1", 
    "moment": "^2.13.0", 
    "ng2-bootstrap": "^1.0.22", 
    "ng2-translate": "^2.2.2", 
    "es6-shim": "0.35.1", 
    "reflect-metadata": "0.1.3", 
    "rxjs": "5.0.0-beta.6", 
    "systemjs": "0.19.26", 
    "zone.js": "0.6.12" 
    }, 
    "devDependencies": { 
    "angular-cli": "1.0.0-beta.9", 
    "codelyzer": "0.0.20", 
    "ember-cli-inject-live-reload": "1.4.0", 
    "jasmine-core": "2.4.1", 
    "jasmine-spec-reporter": "2.5.0", 
    "karma": "0.13.22", 
    "karma-chrome-launcher": "0.2.3", 
    "karma-jasmine": "0.3.8", 
    "protractor": "3.3.0", 
    "ts-node": "0.5.5", 
    "tslint": "3.11.0", 
    "typescript": "1.8.10", 
    "typings": "0.8.1" 
    } 
} 

は私の角度-CLI-build.jsです:

// Angular-CLI build configuration 
// This file lists all the node_modules files that will be used in a build 
// Also see https://github.com/angular/angular-cli/wiki/3rd-party-libs 

/* global require, module */ 

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)' 
    ] 
    }); 
}; 

と私のシステム-config.ts:

// SystemJS configuration file, see links for more information 
// https://github.com/systemjs/systemjs 
// https://github.com/systemjs/systemjs/blob/master/docs/config-api.md 

/*********************************************************************************************** 
* User Configuration. 
**********************************************************************************************/ 
/** Map relative paths to URLs. */ 
const map: any = { 
}; 

/** User packages configuration. */ 
const packages: any = { 
    'moment':{ 
    format: 'cjs' 
    } 
}; 

//////////////////////////////////////////////////////////////////////////////////////////////// 
/*********************************************************************************************** 
* Everything underneath this line is managed by the CLI. 
**********************************************************************************************/ 
const barrels: string[] = [ 
    // Angular specific barrels. 
    '@angular/core', 
    '@angular/common', 
    '@angular/compiler', 
    '@angular/forms', 
    '@angular/http', 
    '@angular/router', 
    '@angular/platform-browser', 
    '@angular/platform-browser-dynamic', 

    // Thirdparty barrels. 
    'rxjs', 
    'ng2-bootstrap', 
    'ng2-translate', 
    'angular2-moment', 
    'moment', 

    // App specific barrels. 
    'app', 
    'app/shared', 
    /** @cli-barrel */ 
]; 

const cliSystemConfigPackages: any = {}; 
barrels.forEach((barrelName: string) => { 
    cliSystemConfigPackages[barrelName] = { main: 'index' }; 
}); 

/** Type declaration for ambient System. */ 
declare var System: any; 

// Apply the CLI SystemJS configuration. 
System.config({ 
    map: { 
    '@angular': 'vendor/@angular', 
    'rxjs': 'vendor/rxjs', 
    'ng2-bootstrap': 'vendor/ng2-bootstrap', 
    'ng2-translate': 'vendor/ng2-translate', 
    'angular2-moment': 'vendor/angular2-moment', 
    'moment': 'vendor/moment/moment.js', 
    'main': 'main.js' 
    }, 
    packages: cliSystemConfigPackages 
}); 

// Apply the user's configuration. 
System.config({ map, packages }); 

エラーメッセージは次のとおりです。

GET http://localhost:8080/ember-cli-live-reload.js 404() 
zone.js:101 GET http://localhost:8080/vendor/moment/moment.js/index.js 404()scheduleTask @ zone.js:101ZoneDelegate.scheduleTask @ zone.js:336Zone.scheduleMacroTask @ zone.js:273(anonymous function) @ zone.js:122send @ VM197:3fetchTextFromURL @ system.src.js:1154(anonymous function) @ system.src.js:1735ZoneAwarePromise @ zone.js:584(anonymous function) @ system.src.js:1734(anonymous function) @ system.src.js:2759(anonymous function) @ system.src.js:3333(anonymous function) @ system.src.js:3600(anonymous function) @ system.src.js:3985(anonymous function) @ system.src.js:4448(anonymous function) @ system.src.js:4700(anonymous function) @ system.src.js:406ZoneDelegate.invoke @ zone.js:323Zone.run @ zone.js:216(anonymous function) @ zone.js:571ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256drainMicroTaskQueue @ zone.js:474ZoneTask.invoke @ zone.js:426 
zone.js:461 Unhandled Promise rejection: Error: XHR error (404) loading http://localhost:8080/vendor/moment/moment.js/index.js 
     at XMLHttpRequest.wrapFn [as _onreadystatechange] (http://localhost:8080/vendor/zone.js/dist/zone.js:769:30) 
     at ZoneDelegate.invokeTask (http://localhost:8080/vendor/zone.js/dist/zone.js:356:38) 
     at Zone.runTask (http://localhost:8080/vendor/zone.js/dist/zone.js:256:48) 
     at XMLHttpRequest.ZoneTask.invoke (http://localhost:8080/vendor/zone.js/dist/zone.js:423:34) 
    Error loading http://localhost:8080/vendor/moment/moment.js/index.js as "moment" from http://localhost:8080/app/main.component.js ; Zone: <root> ; Task: Promise.then ; Value: Error: Error: XHR error (404) loading http://localhost:8080/vendor/moment/moment.js/index.js(…)consoleError @ zone.js:461_loop_1 @ zone.js:490drainMicroTaskQueue @ zone.js:494ZoneTask.invoke @ zone.js:426 
zone.js:463 Error: Uncaught (in promise): Error: Error: XHR error (404) loading http://localhost:8080/vendor/moment/moment.js/index.js(…)consoleError @ zone.js:463_loop_1 @ zone.js:490drainMicroTaskQueue @ zone.js:494ZoneTask.invoke @ zone.js:426 
zone.js:101 GET http://localhost:8080/vendor/moment/moment.js/locale/fr.js 404()scheduleTask @ zone.js:101ZoneDelegate.scheduleTask @ zone.js:336Zone.scheduleMacroTask @ zone.js:273(anonymous function) @ zone.js:122send @ VM197:3fetchTextFromURL @ system.src.js:1154(anonymous function) @ system.src.js:1735ZoneAwarePromise @ zone.js:584(anonymous function) @ system.src.js:1734(anonymous function) @ system.src.js:2759(anonymous function) @ system.src.js:3333(anonymous function) @ system.src.js:3600(anonymous function) @ system.src.js:3985(anonymous function) @ system.src.js:4448(anonymous function) @ system.src.js:4700(anonymous function) @ system.src.js:406ZoneDelegate.invoke @ zone.js:323Zone.run @ zone.js:216(anonymous function) @ zone.js:571ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256drainMicroTaskQueue @ zone.js:474ZoneTask.invoke @ zone.js:426 
zone.js:101 GET http://localhost:8080/vendor/ng2-bootstrap/index.js 404()scheduleTask @ zone.js:101ZoneDelegate.scheduleTask @ zone.js:336Zone.scheduleMacroTask @ zone.js:273(anonymous function) @ zone.js:122send @ VM197:3fetchTextFromURL @ system.src.js:1154(anonymous function) @ system.src.js:1735ZoneAwarePromise @ zone.js:584(anonymous function) @ system.src.js:1734(anonymous function) @ system.src.js:2759(anonymous function) @ system.src.js:3333(anonymous function) @ system.src.js:3600(anonymous function) @ system.src.js:3985(anonymous function) @ system.src.js:4448(anonymous function) @ system.src.js:4700(anonymous function) @ system.src.js:406ZoneDelegate.invoke @ zone.js:323Zone.run @ zone.js:216(anonymous function) @ zone.js:571ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256drainMicroTaskQueue @ zone.js:474ZoneTask.invoke @ zone.js:426 
zone.js:101 GET http://localhost:8080/vendor/ng2-bootstrap/index.js 404()scheduleTask @ zone.js:101ZoneDelegate.scheduleTask @ zone.js:336Zone.scheduleMacroTask @ zone.js:273(anonymous function) @ zone.js:122send @ VM197:3fetchTextFromURL @ system.src.js:1154(anonymous function) @ system.src.js:1735ZoneAwarePromise @ zone.js:584(anonymous function) @ system.src.js:1734(anonymous function) @ system.src.js:2759(anonymous function) @ system.src.js:3333(anonymous function) @ system.src.js:3600(anonymous function) @ system.src.js:3985(anonymous function) @ system.src.js:4448(anonymous function) @ system.src.js:4700(anonymous function) @ system.src.js:406ZoneDelegate.invoke @ zone.js:323Zone.run @ zone.js:216(anonymous function) @ zone.js:571ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256drainMicroTaskQueue @ zone.js:474ZoneTask.invoke @ zone.js:426 
zone.js:101 GET http://localhost:8080/vendor/moment/moment.js/index.js 404()scheduleTask @ zone.js:101ZoneDelegate.scheduleTask @ zone.js:336Zone.scheduleMacroTask @ zone.js:273(anonymous function) @ zone.js:122send @ VM197:3fetchTextFromURL @ system.src.js:1154(anonymous function) @ system.src.js:1735ZoneAwarePromise @ zone.js:584(anonymous function) @ system.src.js:1734(anonymous function) @ system.src.js:2759(anonymous function) @ system.src.js:3333(anonymous function) @ system.src.js:3600(anonymous function) @ system.src.js:3985(anonymous function) @ system.src.js:4448(anonymous function) @ system.src.js:4700(anonymous function) @ system.src.js:406ZoneDelegate.invoke @ zone.js:323Zone.run @ zone.js:216(anonymous function) @ zone.js:571ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256drainMicroTaskQueue @ zone.js:474ZoneTask.invoke @ zone.js:426 

誰か助けてもらえますか?

編集

ここでは、私は一瞬一瞬ロケールをインポートする方法です:

import "moment/locale/fr"; 
import * as moment from "moment"; 

編集2'moment': 'vendor/moment/moment'に瞬間の依存関係を変更した場合、私はまだ、次のエラーメッセージが表示されます。

GET http://localhost:8080/ember-cli-live-reload.js 
zone.js:101 GET http://localhost:8080/vendor/moment/moment/locale/fr.js 404()scheduleTask @ zone.js:101ZoneDelegate.scheduleTask @ zone.js:336Zone.scheduleMacroTask @ zone.js:273(anonymous function) @ zone.js:122send @ VM327:3fetchTextFromURL @ system.src.js:1154(anonymous function) @ system.src.js:1735ZoneAwarePromise @ zone.js:584(anonymous function) @ system.src.js:1734(anonymous function) @ system.src.js:2759(anonymous function) @ system.src.js:3333(anonymous function) @ system.src.js:3600(anonymous function) @ system.src.js:3985(anonymous function) @ system.src.js:4448(anonymous function) @ system.src.js:4700(anonymous function) @ system.src.js:406ZoneDelegate.invoke @ zone.js:323Zone.run @ zone.js:216(anonymous function) @ zone.js:571ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256drainMicroTaskQueue @ zone.js:474ZoneTask.invoke @ zone.js:426 
zone.js:461 Unhandled Promise rejection: Error: XHR error (404) loading http://localhost:8080/vendor/moment/moment/locale/fr.js 
     at XMLHttpRequest.wrapFn [as _onreadystatechange] (http://localhost:8080/vendor/zone.js/dist/zone.js:769:30) 
     at ZoneDelegate.invokeTask (http://localhost:8080/vendor/zone.js/dist/zone.js:356:38) 
     at Zone.runTask (http://localhost:8080/vendor/zone.js/dist/zone.js:256:48) 
     at XMLHttpRequest.ZoneTask.invoke (http://localhost:8080/vendor/zone.js/dist/zone.js:423:34) 
    Error loading http://localhost:8080/vendor/moment/moment/locale/fr.js as "moment/locale/fr" from http://localhost:8080/app/main.component.js ; Zone: <root> ; Task: Promise.then ; Value: Error: Error: XHR error (404) loading http://localhost:8080/vendor/moment/moment/locale/fr.js(…)consoleError @ zone.js:461_loop_1 @ zone.js:490drainMicroTaskQueue @ zone.js:494ZoneTask.invoke @ zone.js:426 
zone.js:463 Error: Uncaught (in promise): Error: Error: XHR error (404) loading http://localhost:8080/vendor/moment/moment/locale/fr.js(…)consoleError @ zone.js:463_loop_1 @ zone.js:490drainMicroTaskQueue @ zone.js:494ZoneTask.invoke @ zone.js:426 
zone.js:101 GET http://localhost:8080/vendor/moment/moment/index.js 404()scheduleTask @ zone.js:101ZoneDelegate.scheduleTask @ zone.js:336Zone.scheduleMacroTask @ zone.js:273(anonymous function) @ zone.js:122send @ VM327:3fetchTextFromURL @ system.src.js:1154(anonymous function) @ system.src.js:1735ZoneAwarePromise @ zone.js:584(anonymous function) @ system.src.js:1734(anonymous function) @ system.src.js:2759(anonymous function) @ system.src.js:3333(anonymous function) @ system.src.js:3600(anonymous function) @ system.src.js:3985(anonymous function) @ system.src.js:4448(anonymous function) @ system.src.js:4700(anonymous function) @ system.src.js:406ZoneDelegate.invoke @ zone.js:323Zone.run @ zone.js:216(anonymous function) @ zone.js:571ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256drainMicroTaskQueue @ zone.js:474ZoneTask.invoke @ zone.js:426 
zone.js:101 GET http://localhost:8080/vendor/ng2-bootstrap/index.js 404()scheduleTask @ zone.js:101ZoneDelegate.scheduleTask @ zone.js:336Zone.scheduleMacroTask @ zone.js:273(anonymous function) @ zone.js:122send @ VM327:3fetchTextFromURL @ system.src.js:1154(anonymous function) @ system.src.js:1735ZoneAwarePromise @ zone.js:584(anonymous function) @ system.src.js:1734(anonymous function) @ system.src.js:2759(anonymous function) @ system.src.js:3333(anonymous function) @ system.src.js:3600(anonymous function) @ system.src.js:3985(anonymous function) @ system.src.js:4448(anonymous function) @ system.src.js:4700(anonymous function) @ system.src.js:406ZoneDelegate.invoke @ zone.js:323Zone.run @ zone.js:216(anonymous function) @ zone.js:571ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256drainMicroTaskQueue @ zone.js:474ZoneTask.invoke @ zone.js:426 
zone.js:101 GET http://localhost:8080/vendor/ng2-bootstrap/index.js 404()scheduleTask @ zone.js:101ZoneDelegate.scheduleTask @ zone.js:336Zone.scheduleMacroTask @ zone.js:273(anonymous function) @ zone.js:122send @ VM327:3fetchTextFromURL @ system.src.js:1154(anonymous function) @ system.src.js:1735ZoneAwarePromise @ zone.js:584(anonymous function) @ system.src.js:1734(anonymous function) @ system.src.js:2759(anonymous function) @ system.src.js:3333(anonymous function) @ system.src.js:3600(anonymous function) @ system.src.js:3985(anonymous function) @ system.src.js:4448(anonymous function) @ system.src.js:4700(anonymous function) @ system.src.js:406ZoneDelegate.invoke @ zone.js:323Zone.run @ zone.js:216(anonymous function) @ zone.js:571ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256drainMicroTaskQueue @ zone.js:474ZoneTask.invoke @ zone.js:426 
zone.js:101 GET http://localhost:8080/vendor/moment/moment/index.js 404()scheduleTask @ zone.js:101ZoneDelegate.scheduleTask @ zone.js:336Zone.scheduleMacroTask @ zone.js:273(anonymous function) @ zone.js:122send @ VM327:3fetchTextFromURL @ system.src.js:1154(anonymous function) @ system.src.js:1735ZoneAwarePromise @ zone.js:584(anonymous function) @ system.src.js:1734(anonymous function) @ system.src.js:2759(anonymous function) @ system.src.js:3333(anonymous function) @ system.src.js:3600(anonymous function) @ system.src.js:3985(anonymous function) @ system.src.js:4448(anonymous function) @ system.src.js:4700(anonymous function) @ system.src.js:406ZoneDelegate.invoke @ zone.js:323Zone.run @ zone.js:216(anonymous function) @ zone.js:571ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256drainMicroTaskQueue @ zone.js:474ZoneTask.invoke @ zone.js:426 

編集3

Failed to load resource: the server responded with a status of 404() 
http://localhost:8080/vendor/ng2-translate/ng2-translate Failed to load resource: the server responded with a status of 404() 
zone.js:461 Unhandled Promise rejection: Error: XHR error (404) loading http://localhost:8080/vendor/ng2-translate/ng2-translate 
     at XMLHttpRequest.wrapFn [as _onreadystatechange] (http://localhost:8080/vendor/zone.js/dist/zone.js:769:30) 
     at ZoneDelegate.invokeTask (http://localhost:8080/vendor/zone.js/dist/zone.js:356:38) 
     at Zone.runTask (http://localhost:8080/vendor/zone.js/dist/zone.js:256:48) 
     at XMLHttpRequest.ZoneTask.invoke (http://localhost:8080/vendor/zone.js/dist/zone.js:423:34) 
    Error loading http://localhost:8080/vendor/ng2-translate/ng2-translate as "ng2-translate/ng2-translate" from http://localhost:8080/main.js ; Zone: <root> ; Task: Promise.then ; Value: Error: Error: XHR error (404) loading http://localhost:8080/vendor/ng2-translate/ng2-translate(…)consoleError @ zone.js:461 
zone.js:463 Error: Uncaught (in promise): Error: Error: XHR error (404) loading http://localhost:8080/vendor/ng2-translate/ng2-translate(…)consoleError @ zone.js:463 
http://localhost:8080/vendor/moment/moment Failed to load resource: the server responded with a status of 404() 
http://localhost:8080/vendor/ng2-translate/ng2-translate Failed to load resource: the server responded with a status of 404() 
http://localhost:8080/vendor/moment/moment/locale/fr.js Failed to load resource: the server responded with a status of 404() 
12system.src.js:371 Assertion failed: loading or loaded(anonymous function) @ system.src.js:371 
http://localhost:8080/vendor/ng2-bootstrap Failed to load resource: the server responded with a status of 404() 
http://localhost:8080/vendor/angular2-moment Failed to load resource: the server responded with a status of 404() 
system.src.js:371 Assertion failed: loading or loaded(anonymous function) @ system.src.js:371 

が編集4:このシステム設定を使用する:

/** Map relative paths to URLs. */ 
const map: any = { 
    'moment':'vendor/moment' 
}; 

/** User packages configuration. */ 
const packages: any = { 
    'moment':{ 
    format: 'cjs', 
    main:'moment.js' 
    } 
}; 

は今、私にこのエラーメッセージを表示します:胴部からのサードパーティの依存関係を削除すると、私は別のエラーメッセージが表示されます

GET http://localhost:8080/ember-cli-live-reload.js 
zone.js:101 GET http://localhost:8080/ng2-translate/ng2-translate 404()scheduleTask @ zone.js:101ZoneDelegate.scheduleTask @ zone.js:336Zone.scheduleMacroTask @ zone.js:273(anonymous function) @ zone.js:122send @ VM371:3fetchTextFromURL @ system.src.js:1154(anonymous function) @ system.src.js:1735ZoneAwarePromise @ zone.js:584(anonymous function) @ system.src.js:1734(anonymous function) @ system.src.js:2759(anonymous function) @ system.src.js:3333(anonymous function) @ system.src.js:3600(anonymous function) @ system.src.js:3985(anonymous function) @ system.src.js:4448(anonymous function) @ system.src.js:4700(anonymous function) @ system.src.js:406ZoneDelegate.invoke @ zone.js:323Zone.run @ zone.js:216(anonymous function) @ zone.js:571ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256drainMicroTaskQueue @ zone.js:474ZoneTask.invoke @ zone.js:426 
zone.js:461 Unhandled Promise rejection: Error: XHR error (404) loading http://localhost:8080/ng2-translate/ng2-translate 
     at XMLHttpRequest.wrapFn [as _onreadystatechange] (http://localhost:8080/vendor/zone.js/dist/zone.js:769:30) 
     at ZoneDelegate.invokeTask (http://localhost:8080/vendor/zone.js/dist/zone.js:356:38) 
     at Zone.runTask (http://localhost:8080/vendor/zone.js/dist/zone.js:256:48) 
     at XMLHttpRequest.ZoneTask.invoke (http://localhost:8080/vendor/zone.js/dist/zone.js:423:34) 
    Error loading http://localhost:8080/ng2-translate/ng2-translate as "ng2-translate/ng2-translate" from http://localhost:8080/main.js ; Zone: <root> ; Task: Promise.then ; Value: Error: Error: XHR error (404) loading http://localhost:8080/ng2-translate/ng2-translate(…)consoleError @ zone.js:461_loop_1 @ zone.js:490drainMicroTaskQueue @ zone.js:494ZoneTask.invoke @ zone.js:426 
zone.js:463 Error: Uncaught (in promise): Error: Error: XHR error (404) loading http://localhost:8080/ng2-translate/ng2-translate(…)consoleError @ zone.js:463_loop_1 @ zone.js:490drainMicroTaskQueue @ zone.js:494ZoneTask.invoke @ zone.js:426 
zone.js:101 GET http://localhost:8080/ng2-translate/ng2-translate 404()scheduleTask @ zone.js:101ZoneDelegate.scheduleTask @ zone.js:336Zone.scheduleMacroTask @ zone.js:273(anonymous function) @ zone.js:122send @ VM371:3fetchTextFromURL @ system.src.js:1154(anonymous function) @ system.src.js:1735ZoneAwarePromise @ zone.js:584(anonymous function) @ system.src.js:1734(anonymous function) @ system.src.js:2759(anonymous function) @ system.src.js:3333(anonymous function) @ system.src.js:3600(anonymous function) @ system.src.js:3985(anonymous function) @ system.src.js:4448(anonymous function) @ system.src.js:4700(anonymous function) @ system.src.js:406ZoneDelegate.invoke @ zone.js:323Zone.run @ zone.js:216(anonymous function) @ zone.js:571ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256drainMicroTaskQueue @ zone.js:474ZoneTask.invoke @ zone.js:426 
12system.src.js:371 Assertion failed: loading or loaded(anonymous function) @ system.src.js:371ZoneDelegate.invoke @ zone.js:323Zone.run @ zone.js:216(anonymous function) @ zone.js:571ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256drainMicroTaskQueue @ zone.js:474ZoneTask.invoke @ zone.js:426 
zone.js:101 GET http://localhost:8080/ng2-bootstrap 404()scheduleTask @ zone.js:101ZoneDelegate.scheduleTask @ zone.js:336Zone.scheduleMacroTask @ zone.js:273(anonymous function) @ zone.js:122send @ VM371:3fetchTextFromURL @ system.src.js:1154(anonymous function) @ system.src.js:1735ZoneAwarePromise @ zone.js:584(anonymous function) @ system.src.js:1734(anonymous function) @ system.src.js:2759(anonymous function) @ system.src.js:3333(anonymous function) @ system.src.js:3600(anonymous function) @ system.src.js:3985(anonymous function) @ system.src.js:4448(anonymous function) @ system.src.js:4700(anonymous function) @ system.src.js:406ZoneDelegate.invoke @ zone.js:323Zone.run @ zone.js:216(anonymous function) @ zone.js:571ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256drainMicroTaskQueue @ zone.js:474ZoneTask.invoke @ zone.js:426 
2system.src.js:371 Assertion failed: loading or loaded(anonymous function) @ system.src.js:371ZoneDelegate.invoke @ zone.js:323Zone.run @ zone.js:216(anonymous function) @ zone.js:571ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256drainMicroTaskQueue @ zone.js:474ZoneTask.invoke @ zone.js:426 
zone.js:101 GET http://localhost:8080/angular2-moment 404()scheduleTask @ zone.js:101ZoneDelegate.scheduleTask @ zone.js:336Zone.scheduleMacroTask @ zone.js:273(anonymous function) @ zone.js:122send @ VM371:3fetchTextFromURL @ system.src.js:1154(anonymous function) @ system.src.js:1735ZoneAwarePromise @ zone.js:584(anonymous function) @ system.src.js:1734(anonymous function) @ system.src.js:2759(anonymous function) @ system.src.js:3333(anonymous function) @ system.src.js:3600(anonymous function) @ system.src.js:3985(anonymous function) @ system.src.js:4448(anonymous function) @ system.src.js:4700(anonymous function) @ system.src.js:406ZoneDelegate.invoke @ zone.js:323Zone.run @ zone.js:216(anonymous function) @ zone.js:571ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256drainMicroTaskQueue @ zone.js:474ZoneTask.invoke @ zone.js:426 
system.src.js:371 Assertion failed: loading or loaded(anonymous function) @ system.src.js:371ZoneDelegate.invoke @ zone.js:323Zone.run @ zone.js:216(anonymous function) @ zone.js:571ZoneDelegate.invokeTask @ zone.js:356Zone.runTask @ zone.js:256drainMicroTaskQueue @ zone.js:474ZoneTask.invoke @ zone.js:426 

編集5:ここに私の最終的な設定であり、それがSE問題をソートしようとしています。

// SystemJS configuration file, see links for more information 
// https://github.com/systemjs/systemjs 
// https://github.com/systemjs/systemjs/blob/master/docs/config-api.md 

/*********************************************************************************************** 
* User Configuration. 
**********************************************************************************************/ 
/** Map relative paths to URLs. */ 
const map: any = { 
    'moment':'vendor/moment' 
}; 

/** User packages configuration. */ 
const packages: any = { 
    'moment':{ 
    format: 'cjs', 
    main:'moment.js' 
    }, 
    'ng2-bootstrap':{ 
    format: 'cjs', 
    main:'ng2-bootstrap.js' 
    } 
}; 

//////////////////////////////////////////////////////////////////////////////////////////////// 
/*********************************************************************************************** 
* Everything underneath this line is managed by the CLI. 
**********************************************************************************************/ 
const barrels: string[] = [ 
    // Angular specific barrels. 
    '@angular/core', 
    '@angular/common', 
    '@angular/compiler', 
    '@angular/forms', 
    '@angular/http', 
    '@angular/router', 
    '@angular/platform-browser', 
    '@angular/platform-browser-dynamic', 

    // Thirdparty barrels. 
    'rxjs', 
    'ng2-bootstrap', 
    'ng2-translate', 
    'angular2-moment', 
    'moment', 

    // App specific barrels. 
    'app', 
    'app/shared', 
    /** @cli-barrel */ 
]; 

const cliSystemConfigPackages: any = {}; 
barrels.forEach((barrelName: string) => { 
    cliSystemConfigPackages[barrelName] = { main: 'index' }; 
}); 

/** Type declaration for ambient System. */ 
declare var System: any; 

// Apply the CLI SystemJS configuration. 
System.config({ 
    map: { 
    '@angular': 'vendor/@angular', 
    'rxjs': 'vendor/rxjs', 
    'ng2-bootstrap': 'vendor/ng2-bootstrap', 
    'ng2-translate': 'vendor/ng2-translate', 
    'angular2-moment': 'vendor/angular2-moment', 
    'moment': 'vendor/moment', 
    'main': 'main.js' 
    }, 
    packages: cliSystemConfigPackages 
}); 

// Apply the user's configuration. 
System.config({ map, packages }); 
+0

私はあなたが問題になっているそのコードスニペットを含むことができ、エラーはあなたが瞬間から輸入しているところであることを推測するだろうか? –

+0

@ JarodMoser:他のサードパーティの依存関係で問題が発生しているのを見ることができるので、私は瞬時にインポートする方法とは何の関係もないと考えています... – balteo

+0

私は、私のサードパーティがシステム-config.tsはファイルの一番上のマップにあり、ファイルの一番下にあるSystem.configマップではなく、User Configurationの直下にあります。 –

答えて

2

モーメントnpmモジュールにはindex.jsというファイルがありません。

なぜエラーです:

/vendor/moment/moment/index.js

これはsystem-config.tsに入るだけのコードです:

/**************************************************************************** 
* User Configuration. 
*****************************************************************************/ 
/** Map relative paths to URLs. */ 

const map: any = { 
    'moment': 'vendor/moment' 
}; 

/** User packages configuration. */ 
const packages: any = { 

    'moment': { 
    format: 'cjs', 
    main: 'moment.js' 
    } 
}; 

//////////////////////////////////////////////////////////////////////////// 

あなたが入れた後:

'moment/**/*.+(js|js.map)'

angular-cli-build.jsサーバーを殺すとng buidを実行する必要がで。

テスト:

import { Component } from '@angular/core'; 
import "moment/locale/fr"; 
import * as moment from "moment"; 
// let now = moment().format('LLLL'); 

@Component({ 
    moduleId: module.id, 
    selector: 'app-root', 
    template: '<button (click)="testing()" >click me</button>', 
    styleUrls: ['app.component.css'] 
}) 
export class AppComponent { 
    title = 'app works!'; 


// public now = moment(); 


testing(){ 


console.log(moment.locale()); // gives fr 

} 

} 
+0

私は '' moment ''に変更しました: 'vendor/moment/moment''私はまだ編集2で述べたようなエラーを受け取ります... – balteo

+0

はい、失敗しました。私はクラスに瞬間のスクリプトを入れてすぐに。ユーザー設定を使用してみてください。 '*この行の下のすべてはCLIによって管理されています。 ' –

+0

あなたのコメントを考慮に入れて投稿を編集しました。 – balteo

関連する問題