2016-04-30 19 views
1

webpack + angular 1.5.5 + ng-forwardを使用しようとしています。 Webpackは角度を解析し、モジュールごとにモジュールを構築します。そして、私は次の関数でのエラーを取得していた角度の初期化中に:angularオブジェクトは({})空のため 角度+ Webpack:初期化時に空の角度オブジェクト

(function extendJQLite(proto) { 
    ... 
})(angular.element.prototype); 

エラーが表示されます。なぜそれが起こるのですか?どのように固定することができますか?(移動角度はexternalsになります)?

私のWebPACKの設定:

{ 
    debug: true, 
    cache: true, 

    verbose: true, 
    displayErrorDetails: true, 
    context: './src', 
    stats: { 
     colors: true, 
     reasons: true 
    }, 
    entry: "./index.ts", 
    output: { 
     path: './build', 
     filename: "build.js" 
    }, 
    resolve: { 
     extensions: ['', '.js', '.ts'] 
    }, 
    module: { 
     loaders: [ 
      { test: /\.ts/, exclude: /node_modules/, loader: 'babel-loader!ts-loader' } 
     ] 
    }, 
    plugins: [ 
     new webpack.ProvidePlugin({ 
      __metadata: 'typescript-metadata', 
      __decorate: 'typescript-decorate', 
      __awaiter: 'typescript-awaiter', 
      __param: 'typescript-param', 
      angular: 'angular' 
     }) 
    ] 
} 

答えて

0

[OK]を、私は2つの方法でそれを解決:babel-loader後にメインローダーセクションでimports-loaderを使用して

1):

loaders: [ 
    { test: /\.ts/, exclude: /node_modules/, loader: 'import?angular!babel-loader!ts-loader' } 
] 

それは動作しますしかし、私にこのような使用をやめさせる他のいくつかの問題があります。だから別の方法があります:

2)私はちょうどすべての依存関係が必要なファイルvendor.jsを作成しました。私が理解しているように、webpackライブラリを使って作業するのは正しい方法です。

0

まったく同じ問題があり、解決策が見つかりました。ここでの問題は、角度1がシムなしのウェブパックでうまく動作していないことです(https://github.com/webpack/webpack/issues/2049参照)。このwebpackローダーの設定を試してください:

module: { 
    loaders: [ 
     /* 
     * Necessary to be able to use angular 1 with webpack as explained in https://github.com/webpack/webpack/issues/2049 
     */ 
     { 
      test: require.resolve('angular'), 
      loader: 'exports?window.angular' 
     }, 
    ] 
}, 
plugins: [ 
    new webpack.ProvidePlugin({ 
     'angular': 'angular', 
    }), 
],