angular2-rc5プロジェクトでのangle2-cookieのインポート

Question

私が始めたangular2 rc5プロジェクトでangular2 cookieモジュールをインポートしようとしています。私の角度-CLI-build.jsファイル編集した

私はNPM

npm install angular2-cookie 

でモジュールをインストール：

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)', 
    'materialize-css/bin/materialize.css', 
    'materialize-css/bin/materialize.js', 
    'socket.io-client/socket.io.js', 
    'angular2-cookie/**/*.+(ts|js|js.map)' 
    ] 
}); 
}; 

はangular2-クッキーフォルダがで作成され

を構築ngの走りました私のdist/vendorフォルダ

私のsystem-config.tsはこのように見えます

"use strict"; 

     // 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 = { 
     }; 

     //////////////////////////////////////////////////////////////////////////////////////////////// 
     /*********************************************************************************************** 
     * 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', 

     // 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', 
      'main': 'main.js', 
      "socket.io-client": "node_modules/socket.io-client/socket.io.js", 
      "angular2-cookie": 'vendor/angular2-cookie' 
     }, 
     packages: cliSystemConfigPackages, 
     "socket.io-client": {"defaultExtension": "js"}, 
     'angular2-cookie' : { defaultExtension: 'js',main: 'core.js'} 
     }); 

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

私はそれをインポートして、私のコンポーネントファイルに

import {CookieService} from 'angular2-cookie/core'; 

をいくつかのコードを追加するために管理が、私はアプリケーションにサービスを提供ngのしようとすると、何らかの理由で、それは次のエラー

でロードに失敗しました

   zone.js:101 GET http://localhost:4200/vendor/angular2-cookie/core 404 (Not Found)scheduleTask @ zone.js:101ZoneDelegate.scheduleTask @ zone.js:336Zone.scheduleMacroTask @ zone.js:273(anonymous function) @ zone.js:122send @ VM308: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 
      2016-09-01 10:48:02.373 zone.js:461 Unhandled Promise rejection: Error: XHR error (404 Not Found) loading http://localhost:4200/vendor/angular2-cookie/core 
        at XMLHttpRequest.wrapFn [as _onreadystatechange] (http://localhost:4200/vendor/zone.js/dist/zone.js:769:30) 
        at ZoneDelegate.invokeTask (http://localhost:4200/vendor/zone.js/dist/zone.js:356:38) 
        at Zone.runTask (http://localhost:4200/vendor/zone.js/dist/zone.js:256:48) 
        at XMLHttpRequest.ZoneTask.invoke (http://localhost:4200/vendor/zone.js/dist/zone.js:423:34) 
       Error loading http://localhost:4200/vendor/angular2-cookie/core as "angular2-cookie/core" from http://localhost:4200/app/app.component.js ; Zone: <root> ; Task: Promise.then ; Value: Error: Error: XHR error (404 Not Found) loading http://localhost:4200/vendor/angular2-cookie/core(…)consoleError @ zone.js:461_loop_1 @ zone.js:490drainMicroTaskQueue @ zone.js:494ZoneTask.invoke @ zone.js:426 
      2016-09-01 10:48:02.378 zone.js:463 Error: Uncaught (in promise): Error: Error: XHR error (404 Not Found) loading http://localhost:4200/vendor/angular2-cookie/core(…) 

は、angular2のCookieフォルダにアクセスできない（または適切に配信されていない）ようですが、理由が見つかりません。

私のpackage.jsonの依存関係：

   "dependencies": { 
         "@angular/common": "2.0.0-rc.5", 
         "@angular/compiler": "2.0.0-rc.5", 
         "@angular/core": "2.0.0-rc.5", 
         "@angular/forms": "0.3.0", 
         "@angular/http": "2.0.0-rc.5", 
         "@angular/platform-browser": "2.0.0-rc.5", 
         "@angular/platform-browser-dynamic": "2.0.0-rc.5", 
         "@angular/router": "3.0.0-rc.1", 
         "angular2-cookie": "^1.2.2", 
         "async": "^2.0.1", 
         "clone": "^1.0.2", 
         "es6-shim": "0.35.1", 
         "express": "^4.14.0", 
         "materialize-css": "^0.97.7", 
         "moment": "^2.14.1", 
         "redis": "^2.6.2", 
         "reflect-metadata": "0.1.3", 
         "rethinkdb": "^2.3.2", 
         "rxjs": "^5.0.0-beta.6", 
         "socket.io": "^1.4.8", 
         "socket.io-client": "^1.4.8", 
         "systemjs": "0.19.37", 
         "typings": "^1.3.1", 
         "zone.js": "0.6.17" 
         }, 
         "devDependencies": { 
         "angular-cli": "1.0.0-beta.10", 
         "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": "1.3.1" 
         } 
        } 

Answer 1

これらのオブジェクトにマップとパッケージを設定する必要があります。これらの行の下のものは変更しないでください。

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

/** User packages configuration. */ 
const packages: any = { 
    'angular2-cookie': {main: 'core.js', defaultExtension: 'js'}, 
}; 

現在angular2-cookieはRC6では動作しませんが、新しいバージョンでは、道を進んでいます。私はそれが今日または明日リリースされると思う。

最新の質問

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.

 関連する問題

• 1.
• 2.
• 3.
• 4.
• 5.
• 6.
• 7.
• 8.
• 9.
• 10.