需要使用支持多个地区的angular2 webpack插件的i18n webpack插件的工作示例

我正在为prod env使用以下网页包配置。虽然它工作得很好，但它并不是最优化的代码，因为它在所有地区运行每个插件。例如，理想情况下，复制插件应该仅在i18n插件在所有地区运行后调用。或者，假设我只想国际化main.bundle.js条目文件，而不想国际化其他条目文件。请帮我写一个更优化的配置

const helpers = require('./helpers');
const webpackMerge = require('webpack-merge'); 
const commonConfig = require('./webpack.common.js');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const ProvidePlugin = require('webpack/lib/ProvidePlugin');
const DefinePlugin = require('webpack/lib/DefinePlugin');
const NormalModuleReplacementPlugin = require('webpack/lib/NormalModuleReplacementPlugin');
const IgnorePlugin = require('webpack/lib/IgnorePlugin');
const DedupePlugin = require('webpack/lib/optimize/DedupePlugin');
const UglifyJsPlugin = require('webpack/lib/optimize/UglifyJsPlugin');
const WebpackMd5Hash = require('webpack-md5-hash');


const ENV = process.env.NODE_ENV = process.env.ENV = 'production';
const HOST = process.env.HOST || 'localhost';
const PORT = process.env.PORT || 8080;
const METADATA = webpackMerge(commonConfig({env: ENV}).metadata, {
  host: HOST,
  port: PORT,
  ENV: ENV,
  HMR: false
});

const I18nPlugin  = require("webpack/node_modules/i18n-webpack-plugin");
var languages = {
  "en" : null,
  "hi": require("./locales/hi.json"),
  "de": require("./locales/de.json")
};

var path = require("path");
module.exports = function(env) {
 return Object.keys(languages).map(function(locale) {

  return  webpackMerge(commonConfig({env: ENV}), {


    debug: false,


    devtool: 'source-map',


    output: {


      path: helpers.root('dist'),
      //path: helpers.root('dist/' + METADATA.title + '/static'),


      filename: ((locale  == "en" )? "" : (locale +'.'))   + '[name].[chunkhash].bundle.js',


      sourceMapFilename: ((locale  == "en" )? "" : (locale +'.')) + '[name].[chunkhash].bundle.map',


      chunkFilename: ((locale  == "en" )? "" : (locale +'.')) + '[id].[chunkhash].chunk.js'

    },


    plugins: [
      new HtmlWebpackPlugin({
        template: 'src/index.html',
        filename: 'index.' + ((locale  == "en" )? "" : (locale +'.'))  +'html',
        chunksSortMode: 'dependency'
      }),
       new I18nPlugin(
                languages[locale]
            ),

      new WebpackMd5Hash(),



      new DefinePlugin({
        'ENV': JSON.stringify(METADATA.ENV),
        'HMR': METADATA.HMR,
        'process.env': {
          'ENV': JSON.stringify(METADATA.ENV),
          'NODE_ENV': JSON.stringify(METADATA.ENV),
          'HMR': METADATA.HMR,
        }
      }),
      new UglifyJsPlugin({
        beautify: false, //prod
        mangle: { screw_ie8 : true, keep_fnames: true }, //prod
        compress: { screw_ie8: true }, //prod
        comments: false //prod
      }),


      new NormalModuleReplacementPlugin(
        /angular2-hmr/,
        helpers.root('config/modules/angular2-hmr-prod.js')
      ),



    ],


    tslint: {
      emitErrors: true,
      failOnHint: true,
      resourcePath: 'src'
    },

    *ngFor
    htmlLoader: {
      minimize: true,
      removeAttributeQuotes: false,
      caseSensitive: true,
      customAttrSurround: [
        [/#/, /(?:)/],
        [/\*/, /(?:)/],
        [/\[?\(?/, /(?:)/]
      ],
      customAttrAssign: [/\)?\]?=/]
    },

    /*
     * Include polyfills or mocks for various node stuff
     * Description: Node configuration
     *
     * See: https://webpack.github.io/docs/configuration.html#node
     */
    node: {
      global: 'window',
      crypto: 'empty',
      process: false,
      module: false,
      clearImmediate: false,
      setImmediate: false
    }

  });


});


}

---

当我为angular 2项目实施本地化时，我最终完成了一项服务。传入locale和key，然后返回本地化字符串。我不确定将本地化添加为web包插件会带来什么好处。

当我为angular 2项目实施本地化时，我最终提供了一项服务。传入locale和key，然后返回本地化字符串。我不确定将本地化添加为web包插件会带来什么好处。

使用起来似乎非常简单：

  module: {
    rules: [
      { test: /\.(intl|i18n|yml|yaml)$/i,
        use: [
          IntlPlugin.loader()
        ]
      },
    ]
  },
  plugins: [
    new IntlPlugin({
      search: [ './locales/**/*.json' ]
    })

使用起来似乎非常简单：

  module: {
    rules: [
      { test: /\.(intl|i18n|yml|yaml)$/i,
        use: [
          IntlPlugin.loader()
        ]
      },
    ]
  },
  plugins: [
    new IntlPlugin({
      search: [ './locales/**/*.json' ]
    })

---

是的，甚至我也认为，正如您正确指出的，通过服务使用运行时本地化有其固有的优势，但对我来说，问题是，本地化字符串的数量相当高，应用程序应该在内存和处理能力有限的低端android手机上运行加载预翻译的语言环境文件有助于我实现这一点是的，甚至我也认为通过服务使用运行时本地化有其固有的优势，正如您正确指出的但对我来说，问题是本地化字符串的数量非常多，应用程序应该在内存和处理能力有限的低端android手机上运行。加载预翻译的语言环境文件有助于我解决问题。。