エレクトロン、Angular2、「FS」

Question

私は角度の話題に非常に新しいです、Javascriptのなど

私は、ファイル・システムにアクセスする必要があります（活字体）Angular2電子アプリケーションを作成してみてください。誰もが "fs"モジュールを必要としていると言いますが、それでも問題はありませんが、それは私にとってはうまくいかないのです...。

私はのような何かを行う場合：var fs = require('fs');

を、私は私のアプリは、私のアプリのルートフォルダからその "FS" モジュールをロードしようとしていることがわかります。 ..myapp/DIST/FSネット:: ERR_FILE_NOT_FOUND

すべて私の他の外部モジュールは、index.htmlの中で参照されています

<!-- build:js app/scripts/combined.js --> 
 
    <script src="../node_modules/jquery/dist/jquery.js"></script> 
 
    <script src="../node_modules/angular2/bundles/angular2-polyfills.js"></script> 
 
    <script src="../node_modules/systemjs/dist/system.js"></script> 
 
    <script src="../node_modules/angular2/bundles/angular2.dev.js"></script> 
 
    <script src="../node_modules/angular2/bundles/http.js"></script> 
 
    <script src="../node_modules/angular2/bundles/router.js"></script> 
 
    <script src="../node_modules/rxjs/bundles/Rx.js"></script> 
 
    <script src="../node_modules/bootstrap/dist/js/bootstrap.js"></script> 
 
    <script src="../node_modules/pdfjs-dist/build/pdf.combined.js"></script> 
 
    <script src="boot.js" type="text/javascript"></script> 
 
    <!-- endbuild -->

それゆえ、私はそれらが見つかりましたが、 "fs"は電子に存在するnode.jsに属していると思いますか？それとも、私の考えで大きなミスをしたことがありますか？

どうもありがとう、
クリス

Answer 1

の問題は、私は私のアンギュラアプリケーションでSystemJSを使用することのようです。 SystemJSは自分のアプリケーションからモジュールをロードしようとします。

私は今では動作しているように私のindex.htmlを、これを追加しています

<script> 
    if (require) { 
     window.$ = window.jQuery = require('./app/assets/js/jquery.min.js'); 
     window.fs = require('fs'); 
     window.path = require('path'); 
    } 
</script> 

Answer 2

は私が同様の質問にmeltedspark's answerを引用してみましょう：

System.jsオーバーライドNode.jsのrequire方法と独自の解決メカニズムを使用します。ここで

は、この問題に対する私のソリューションです：

1. 使用する各Node.jsモジュールの再輸出を作成します。これらを検索する場所を知っている

   // scripts/node-re-exports/fs.ts 
   declare const System: any; 
   const fs = System._nodeRequire('fs'); 
   export = fs; 
   
   // scripts/node-re-exports/electron.ts 
   declare const System: any; 
   const electron = System._nodeRequire('electron'); 
   export = electron; 
   

2. systemjs.config.jsをしてみましょう再輸出する。

   map: { 
       ... 
   
       // Re-exports of Node.js modules. 
       fs: 'compiled/node-re-exports/fs.js', 
       electron: 'compiled/node-re-exports/electron.js' 
   } 
   

3. いつものように、あなたのAngular2コンポーネントでこれらのモジュールをインポートします。 "FS" を使用

   import { Component } from '@angular/core'; 
   import { clipboard } from 'electron'; 
   import { existsSync } from 'fs'; 
   
   @Component({ 
       selector: 'my-app', 
       template: `<h1>Hello {{name}}</h1>`, 
   }) 
   export class AppComponent { 
       name = 'Angular'; 
   
       constructor() { 
        const text = existsSync("c:\\boot.txt") ? "exists" : "does not exist"; 
        clipboard.write({ text: text }); 
       }; 
   } 
   

Answer 3

：systemjsに "@ノード/ fsが" あなたは問題を完全に解決することができるマップ。 次に、通常の方法でネイティブノードモジュールをインポートできます。

import {existsSync} from 'fs';

Answer 4

Angular 2とelectron（それにはネイティブライブラリも含まれています）以上のものをカバーするgithubprojectがあります。
私はあなたに似た多くの問題、特にelectronのアプリケーションからnode.jsモジュールにアクセスするという問題に遭遇しました。
おそらく、最初からすべてを書き込むのではなく、それを出発点として使用する価値があります。

あなたの問題については、あなたの代わりにrequire('fs')SystemJSとして、ルックアップ・メカニズムのSystem._nodeRequire('fs')を使うべきではnodeのものとは少し異なっています。