Javascript 在webpack中,是否可以将相同的入口点输出到两个输出文件,一个通过babel编译到ES5,另一个使用ES6代码

Javascript 在webpack中,是否可以将相同的入口点输出到两个输出文件,一个通过babel编译到ES5,另一个使用ES6代码,javascript,webpack,ecmascript-6,babeljs,Javascript,Webpack,Ecmascript 6,Babeljs,在webpack中,是否可以将相同的入口点输出到两个输出文件,一个通过babel编译到ES5,另一个不使用babel编译到ES6 目前,我有以下网页配置: const path = require('path'); const webpack = require('webpack'); const CleanWebpackPlugin = require('clean-webpack-plugin'); const ExtractTextPlugin = require('extract-tex

在webpack中,是否可以将相同的入口点输出到两个输出文件,一个通过babel编译到ES5,另一个不使用babel编译到ES6

目前,我有以下网页配置:

const path = require('path');
const webpack = require('webpack');
const CleanWebpackPlugin = require('clean-webpack-plugin');
const ExtractTextPlugin = require('extract-text-webpack-plugin');

module.exports = {

    entry: {
        'output-es5': './src/index.js'
    },
    output: {
        filename: '[name].min.js',
        path: path.resolve(__dirname, 'dist')
    },
    mode: 'production',

    //https://webpack.js.org/configuration/devtool/
    devtool: 'source-map'

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

        //https://webpack.js.org/plugins/extract-text-webpack-plugin/
        new ExtractTextPlugin('jplist.styles.css'),
    ],

    module: {
        rules: [
            {
                test: /\.js$/,
                exclude: /(node_modules|bower_components)/,
                use: {
                    loader: 'babel-loader',
                    options: {
                        presets: ['es2015']
                    }
                }
            },
            {
                test: /\.css$/,
                use: ExtractTextPlugin.extract({
                    fallback: 'style-loader',
                    use: [
                        {
                            loader: 'css-loader',
                            options: { minimize: false }
                        },
                        {
                            loader: 'postcss-loader',
                            options: {
                                minimize: false,
                                plugins: (loader) => [
                                    require('postcss-import')({ root: loader.resourcePath }),
                                    require('postcss-cssnext')({warnForDuplicates: false}),
                                    require('postcss-nested')(),
                                    require('postcss-simple-vars')(),
                                    require('autoprefixer')(),
                                    require('postcss-prettify')(),
                                    //require('cssnano')({zindex: false})
                                ]
                            }
                        }
                    ]
                })
            }
        ]
    }
};
我希望得到以下输出:

output-es5.min.js-使用babel编译为es5 output-es6.min.js-es6代码 可能吗


谢谢

是的,您的文件可以导出配置数组,而不是导出对象

// You can put shared config in a base config.
const baseConfig = {
   entry: './src/index.js', // not needed with webpack4 this is the default
   ...
};

// Using lodash merge here as it does a deep merge but up to you
const es5Config = merge({}, baseConfig, {
  output: { ... },
  loaders: { ...babel... },
  ...
});

const es6Config = merge({}, baseConfig, {
  output: { ... },
  ...
});

module.exports = [es5Config, es6Config];

谢谢,我用Object.assign代替了lodash merge。