のWebPACKを実行するためのカルマにNODE_ENVを設定する適切な方法は何ですか？

Question

私はWebPACKのと私のプロジェクトをビルドしてテストを実行するためのカルマを使用しています。

ウェブホストがプロダクションドメイン名ではなくlocalhostにマップされたURLを持つテスト環境用のプロジェクトの条件付きビルドを実行するために、process.env.NODE_ENVを "テスト"に設定するようにカルマを設定します。

この目的のために、Webpackのenv-replace-loaderを使用します。これは、コンフィグレーションファイルenvironments.jsonを読み込み、process.env.NODE_ENVの値に応じてAPI_URLなどの変数を設定します。プロダクションビルドではGulpを使ってprocess.env.NODE_ENVを設定し、webpackを起動します。できます。

process.env.NODE_ENV = 'test'をテストビルドに設定したい場合は、karma start karma.conf.jsを実行して開始します。現在、私はちょうどkarma.conf.jsでprocess.env.NODE_ENV = "test"を言います。

それを行うには良い方法はありますか？

---

以外にも、私はこのように、この変数を設定するwebpack.config.jsにWebPACKののDefinePluginを使用しようとしました：

const webpackConfig = { 
    ... 
    plugins: [ 
     new webpack.DefinePlugin({ 
      process.env: {'NODE_ENV': 'test'} 
     }), 
     ... 
    ], 
    ... 
} 

をし、それが動作しません：WebPACKのenv-replace-loader呪いそのModule build failed: TypeError: Cannot read property 'URL' of undefined - 私は、それができると仮定表示されないノードレポートにアクセスしない

Answer 1

webpackの設定では、このJSON.stringify（ 'name'）を試してください。例えば、またはそのような何かを実行しているのWebPACKで動作します

plugins: [ 
    new webpack.DefinePlugin({ 
     'process.env': { 
      NODE_ENV: JSON.stringify('production'), 
      APP_ENV: JSON.stringify('browser') 
     }, 
    }) 
    ], 

：このような何かを試してみてください。たとえば、私は例を実行するときにCSSを要求するのにそれを使用していますが、本番用にコンパイルするときは無視されます。

私はKarmaの設定で同じ問題を抱えましたが、Karmaの設定ファイルのwebpack部分にプラグインを追加することを修正しました。これは私のファイルです：

const webpack = require('webpack'); 

module.exports = function(config) { 
    config.set({ 
    browsers: ['PhantomJS'], 
    files: [ 
     'tests.webpack.js', 
     { 
     pattern: 'src/**/__tests__/*.js', 
     included: false, 
     served: false, 
     watched: true 
     } 
    ], 
    frameworks: ['jasmine'], 
    preprocessors: { 
     'tests.webpack.js': ['webpack', 'sourcemap', 'coverage'], 
    }, 
    reporters: ['progress', 'notification'], 
    webpack: { 
     devtool: 'inline-source-map', 
     module: { 
     loaders: [ 
      { test: /\.jsx?$/, exclude: /node_modules/, loader: 'babel-loader' } 
     ] 
     }, 
     plugins: [ 
     new webpack.DefinePlugin({ 
      'process.env': { 
       NODE_ENV: JSON.stringify('test') 
      } 
     }) 
     ], 
     watch: true 
    }, 
    webpackServer: { 
     noInfo: true, 
    } 
    }); 
}; 

私もあなたにも役立つことを望みます！