2017-08-29 26 views
0

RquireJS 2.2からWebpack 3にAngular 1.5アプリを移行します。現在のRequireJSコードをサポートし、Webpack + ES6に徐々に移行するWebpack環境を設定します。テストを書き、ソースコードをリファクタリングします。私はwebpackコマンドでバンドルを生成しようとすると、モジュールが見つかりません:エラー: 'エクスポート'を解決できません

は今、私は次のエラーを取得する:

[email protected]:~/dev/myapp$ webpack 
Hash: 3ac8a9bb3d386514f8a6 
Version: webpack 3.4.1 
Time: 101ms 
    Asset  Size Chunks    Chunk Names 
bundle.js 10.7 kB  0 [emitted] main 
    [0] ./app/bootstrap.js 82 bytes {0} [built] 
    [2] ./app/app.js 7.37 kB {0} [built] 
    + 1 hidden module 

ERROR in ./app/app.js 
Module not found: Error: Can't resolve 'services/routeResolver' in '/home/trex/dev/myapp/app' 
@ ./app/app.js 3:0-175:2 
@ ./app/bootstrap.js 

ERROR in ./node_modules/angular/index.js 
Module not found: Error: Can't resolve 'exports' in '/home/trex/dev/myapp' 
@ ./node_modules/angular/index.js 1:0-20 
@ ./app/bootstrap.js 

私は私の場合には輸出を設定できますか?

アプリケーション構造:

[email protected]:~/dev$ tree -L 1 myapp 
theapp 
├── app 
├── css 
├── font-awesome 
├── fonts 
├── img 
├── index.html 
├── lang 
├── lib 
├── node_modules 
├── package.json 
├── README.md 
├── resources 
├── scripts 
├── share 
├── templates 
├── tests 
└── widgets 

は、いくつかのライブラリは、node_moduleslibフォルダ内の他のです。 index.htmlの中に直接リンクされたすべてのライブラリ: <script type="application/javascript" src="lib/angular/angular.min.js" ></script>

のWebPACKの設定:ソースコードの

[email protected]:~/dev$ cat myapp/webpack.config.js 
var webpack = require('webpack'); 
var path = require('path'); 

module.exports = { 
    entry: "./app/bootstrap.js", 
    output: { 
     path: __dirname + '/dist/', 
     filename: "bundle.js" 
    }, 
    module: { 
     loaders: [ 
      { test: /\.css$/, loader: "style!css" }, 
      { test: /[\/]angular\.js$/, loader: "exports?angular" } 
     ] 
    }, 
    resolve: { 
     alias: {}, 
     extensions: ['.js', '.json'], 
     modules: [ 
     'node_modules', 
     'lib' 
     ] 
    } 
}; 

個:

--- UPDATE

IはES6にコードを変換します。

そして今、私次のエラーがあります。

[email protected]:~/dev/myapp$ webpack 
Hash: 673f49fc25bd759ea99d 
Version: webpack 3.4.1 
Time: 118ms 
    Asset  Size Chunks    Chunk Names 
bundle.js 18.2 kB  0 [emitted] main 
    [1] ./app/bootstrap.js 78 bytes {0} [built] 
    [2] ./app/app.js 7.35 kB {0} [built] 
    [3] ./app/services/routeResolver.js 7.07 kB {0} [built] 
    + 1 hidden module 

ERROR in ./node_modules/angular/index.js 
Module not found: Error: Can't resolve 'exports' in '/home/trex/dev/myspp' 
@ ./node_modules/angular/index.js 1:0-20 
@ ./app/bootstrap.js 

答えて

1

Webpackは、app.js AMDモジュールの依存関係として定義されたモジュールservices/routeResolverをインポートできません。

あなたはこのhttps://github.com/jonbretman/amd-to-as6またはこのhttps://github.com/buxlabs/amd-to-es6

+0

あなたはbootstrap.jsと./node_modules/angular/index.jsファイルを提供することができますように、ES6にAMDから自動的にコンバータを使用しようとすることができますか? node_modulesで正確にどのような角度のバージョンですか? –

関連する問題