需要使用具有不同环境文件的webpack构建angular 5应用

时间:2018-06-27 07:27:24

标签: angular webpack angular5 webpack-4

你好,我已经在我的angular 5应用程序中实现了webpack,现在它可以正常运行了。 但是我无法为我的构建设置环境。 以前在执行Webpack之前,我是通过以下命令构建应用程序的

ng build--aot --i18nFile=src/assets/locale/messages.ar.xlf --i18nFormat=xlf --locale=ar --environment=arabic

现在我想知道在webpack实施之后,与上述构建命令中设置的配置相同的命令是什么。

现在我的webpack.config.js中只写了一行

module.exports = require('./config/webpack.prod.js');

和我的webpack.prod.js代码在下面

var webpack = require('webpack');
var webpackMerge = require('webpack-merge');
var ExtractTextPlugin = require('extract-text-webpack-plugin');
var commonConfig = require('./webpack.common.js');
var helpers = require('./helpers');

const ENV = process.env.NODE_ENV = process.env.ENV = 'production';

module.exports = webpackMerge(commonConfig, {
  devtool: 'source-map',

  output: {
    path: helpers.root('dist'),
    publicPath: '/',
    filename: '[name].[hash].js',
    chunkFilename: '[id].[hash].chunk.js'
  },

  plugins: [
    new webpack.NoEmitOnErrorsPlugin(),
    new webpack.optimize.UglifyJsPlugin({ // https://github.com/angular/angular/issues/10618
      mangle: {
        keep_fnames: true
      }
    }),
    new ExtractTextPlugin('[name].[hash].scss'),
    new ExtractTextPlugin('[name].[hash].css'),

    new webpack.DefinePlugin({
      'process.env': {
        'ENV': JSON.stringify(ENV)
      }
    }),
    new webpack.LoaderOptionsPlugin({
      htmlLoader: {
        minimize: false // workaround for ng2
      }
    })
  ]
});

当前正在使用以下命令创建Webpack构建

cross-env NODE_ENV=prod webpack 

此命令的构建引用了我的environment.ts文件和messages.xlf文件 但是我需要引用环境文件夹中的environment.arabic.ts文件和区域设置文件夹中的messages.ar.xlf。

0 个答案:

没有答案