ロード定期NPMパッケージを[モジュールを見つけることができません]インターネットの

Question

こんにちは親愛なる人、

にはどうすればいいので、角度CLI（@angular/cli）は、「ファイル・セーバー」のような「通常のNPMパッケージ」を見つけることができますそこに提供されているsaveAs（） - 関数などを使用できますか？私は、最初の、最小限のプロジェクトを作成しました。これは、ファイルシステムをインストールし、次のように試しましたが、どちらもうまくいきませんでした。

import {Component, OnInit} from '@angular/core'; 
import {saveAs} from 'file-saver'; 
//import saveAs from 'file-saver'; didn't worked as well 

@Component({ 
    selector: 'app-root', 
    templateUrl: './app.component.html', 
    styleUrls: ['./app.component.css'] 
}) 
export class AppComponent implements OnInit { 
    ngOnInit(): void { 
     saveAs("file.txt", new Blob()); 
    } 

    title = 'app works!'; 
} 

ERROR in multi script-loader!./src/~/file-saver/FileSaver.js Module not found: Error: Can't resolve 'C:\Users*\Desktop\ng-cli-playground\src\node_modules\file-saver\FileSaver.js' in 'C:\Users*\Desktop\ng-cli-playground' @ multi script-loader!./src/~/file-saver/FileSaver.js

ERROR in C:/Users/*/Desktop/ng-cli-playground/src/app/app.component.ts (2,22): Cannot find module 'file-saver'.)

私のCLI設定

{ 
    "project": { 
     "version": "1.0.0-beta.26", 
     "name": "ng-cli-test" 
    }, 
    "apps": [ 
     { 
      "root": "src", 
      "outDir": "dist", 
      "assets": [ 
       "assets", 
       "favicon.ico" 
      ], 
      "index": "index.html", 
      "main": "main.ts", 
      "test": "test.ts", 
      "tsconfig": "tsconfig.json", 
      "prefix": "app", 
      "mobile": false, 
      "scripts": [ 
       "node_modules/file-saver/FileSaver.js" 
      ], 
      "environments": { 
       "source": "environments/environment.ts", 
       "dev": "environments/environment.ts", 
       "prod": "environments/environment.prod.ts" 
      } 
     } 
    ], 
    "e2e": { 
     "protractor": { 
      "config": "./protractor.conf.js" 
     } 
    }, 
    "test": { 
     "karma": { 
      "config": "./karma.conf.js" 
     } 
    }, 
    "webpack": { 
     "development": { 
      "config": "config/webpack.dev.conf.js" 
     }, 
     "defaults": { 
      "styleExt": "css", 
      "prefixInterfaces": false, 
      "inline": { 
       "style": false, 
       "template": false 
      }, 
      "spec": { 
       "class": false, 
       "component": true, 
       "directive": true, 
       "module": false, 
       "pipe": true, 
       "service": true 
      } 
     } 
    } 
} 

PS：私は今7ヶ月angular2でプログラミングしていますが、私はsystemJSでそれを行うために使用されます。とにかく、ビルディング、ローディング、バンドリングの各ツールがどのように機能するのかを理解することは本当に難しいです。ありがとうございます！

Answer 1

それは、このエラーからあなたの srcフォルダを見ているようだ

：

C:\Users*\Desktop\ng-cli-playground\src\node_modules\file-saver\FileSaver.js

試してみてください。

"scripts": [ 
    "../node_modules/file-saver/FileSaver.js" 
     ]