Angular Webpack アプリで環境に依存する変数を渡す方法は?

Webpack で環境に依存する変数を渡す

Angular アプリを Gulp から Webpack に変換すると、NODE_ENV に基づいて HTML ページ変数を置き換えるという課題が発生します。 Webpack を使用してこれを実現する効果的な方法をいくつか紹介します。

1. DefinePlugin

このプラグインでは、一致した変数を指定された文字列で置き換えることができます:

new webpack.DefinePlugin({
    'process.env.NODE_ENV': JSON.stringify(process.env.NODE_ENV || 'development')
}),

2。 EnvironmentPlugin

このプラグインは、内部で DefinePlugin を使用して、環境値をコードにマップします:

new webpack.EnvironmentPlugin(['NODE_ENV'])

3。 Alias

エイリアス化されたモジュールを作成すると、コンシューマ モジュールを介して設定にアクセスできます。

// Consumer side
var config = require('config');

// Configuration module
resolve: {
    alias: {
        config: path.join(__dirname, 'config', process.env.NODE_ENV)
    }
}

NODE_ENV に応じて、これは設定をエクスポートするモジュールにマップされ、アプリケーション内の環境依存変数にアクセスします。

以上がAngular Webpack アプリで環境に依存する変数を渡す方法は?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。