Webpack配置扩展

时间:2018-07-02 17:24:16

标签: webpack

我有两个彼此相邻的项目。

/projectA
 |
 ----- /client
/projectB
 |
 ----- /client

我在/ projectA内部有/projectA/webpack.config.js,可将所有文件编译为projectA / public / javascripts / generated。 我如何创建/projectB/webpack.config.js来编译/ projectB / client中的文件并将其输出到/ projectA / public / javascripts / generated?

这是我的/projectA/webpack.config.js:

  const webpack = require('webpack');
  const path = require('path');
  const autoprefixer = require('autoprefixer');
  const urlrewrite = require('postcss-urlrewrite');

  const NODE_ENV = process.env.NODE_ENV || 'development';

  console.log('Current NODE_ENV is', NODE_ENV);

  const isDev = NODE_ENV === 'development';
  const isMobile = process.env.MOBILE_DEVICE_BUILD || false;
  const localIdentName = '[name]-[local]-[hash:base64:8]';

  const moduleRegexp = /node_modules\//;

  var plugins = [
    new webpack.ContextReplacementPlugin(/moment[\/\\]locale$/, /en|ru|kk/),
    new webpack.optimize.CommonsChunkPlugin({ name: 'vendor', filename: 'react-vendor-bundle.es6.js' }),
    new webpack.DefinePlugin({
      "process.env.NODE_ENV": JSON.stringify(NODE_ENV)
    })
  ];

  var loader = [];

  if (process.env.DEV_SERVER) {
    loader.push('webpack-dev-server/client?http://localhost:8080', 'webpack/hot/only-dev-server');
    plugins.push(new webpack.HotModuleReplacementPlugin());
  }

  loader.push('./loader.jsx');

  const postcssPlugins = [
    autoprefixer({
      browsers: [
        'last 3 versions',
        'ie >= 11',
        'ios >= 8',
        'android >= 4.4',
      ]
    })
  ];

  if (isMobile) {
    postcssPlugins.push(
      urlrewrite({
        imports: false,
        properties: ['background', 'content'],
        rules: [
          {from: /\/(public\/)/, to: '$1'},
        ]
      })
    );
  }

  const clientPath = __dirname + '/client';

  module.exports = {
    context: clientPath,
    entry: {
      loader: loader,
      vendor: [
        'react',
        'react-dom',
        'react-bootstrap',
        'intl',
        'classnames',
        'underscore',
        'moment',
        'lodash',
        'sprintf-js'
      ],
      alseco: './alseco/index.js',
      admin: './admin/index.jsx'
    },
    output: {
      path: __dirname + "/public/javascripts/generated",
      filename: "[name]-react-app-bundle.es6.js",
      publicPath: "/public/javascripts/generated"
    },
    module: {
      loaders: [
        {
          test: /\.jsx?$/,
          exclude: moduleRegexp,
          loaders: ['react-hot', 'babel-loader?cacheDirectory']
        },
        {
          test: /\.css$/,
          exclude: moduleRegexp,
          loaders: [
            'style',
            'css?modules&url=false&importLoaders=1&localIdentName=' + localIdentName,
            'csso',
            'postcss'
          ]
        },
        {
          test: /\.json$/,
          loader: 'json-loader'
        }
      ]
    },

    node: {
      fs: 'empty'
    },

    devtool: false,

    resolve: {
      extensions: [ '', '.js', '.jsx', '.css' ]
    },

    plugins: plugins,

    postcss: () => postcssPlugins,

    watch: isDev,

    watchOptions: {
      aggregateTimeout: 100
    }
  };

0 个答案:

没有答案