Question

我有一个反应项目，但我分成两部分（管理员，前面）。我想通过一个webpack devserver来维护这两个不同的端口。

我可以运行“npm run start”，两部分在不同的端口工作

我使用webpack构建，在dist目录中输出

admin.html
index.html
admin.js
index.js
common.js

如果我打开localhost：8081 - ＆gt;必须返回index.html（包括index.js和common.js）

如果我打开localhost：8082 - ＆gt;必须返回admin.html（包括admin.js，common.js）

webpack配置：

entry: options.production ? {
        interview: ["./app/src/pages/interview/main.js"],
        admin: ["./app/src/pages/dashboard/main.js"]
    } : {
        interview: [
            'webpack-dev-server/client?http://' + options.ip + ':8081',
            "./app/src/pages/interview/main.js",
            'webpack/hot/only-dev-server'],
        admin: ['webpack-dev-server/client?http://' + options.ip + ':8082',
            'webpack/hot/only-dev-server',
            "./app/src/pages/dashboard/main.js"]
    },
 output: {
            path: options.production ? './dist' : './build',
            publicPath: options.production ? '' : 'http://' + options.ip + ':8081/',
            filename: options.production ? '[name].app.[hash].min.js' : '[name].app.js',
        },
        plugins: options.production ? [
        //new DashboardPlugin(),
        // Important to keep React file size down
        new CommonsChunkPlugin("commons.chunk.js"),
        new webpack.DefinePlugin({
            'process.env': {
                'NODE_ENV': JSON.stringify('production'),
            },
        }),
        new webpack.optimize.DedupePlugin(),
        new webpack.optimize.UglifyJsPlugin({
            minimize: true,
            beautify: false,
            comments: false,
            compress: {
                warnings: false,

            },
            mangle: {
                // Don't mangle $
                except: ['$', '_', '*', '$super', 'exports', 'require'],
                // Don't care about IE8
                screw_ie8: true,
                // Don't mangle function names
                keep_fnames: true
            }
        }),

        //new ExtractTextPlugin('app.[hash].css'),
        new HtmlWebpackPlugin({
            template: './conf/tmpl.html',
            production: true,
            filename: "index.html",
            excludeChunks: ['admin']
        }),
        new HtmlWebpackPlugin({
            template: './conf/tmpl.html',
            production: true,
            filename: "admin.html",
            excludeChunks: ['interview']
        }),
        new webpack.DefinePlugin({ //export all environment variables
            //todo check that if this is really working
            'process.env': {
                DENEME: JSON.stringify("mesut"),
                APPCONFIG: JSON.stringify(confParams)
            }
        })
    ] : [

        new CommonsChunkPlugin("commons.chunk.js"),

        new HtmlWebpackPlugin({
            template: './conf/tmpl.html',
            filename: "index.html",
            excludeChunks: ['admin']
        }),
        new HtmlWebpackPlugin({
            template: './conf/tmpl.html',
            filename: "admin.html",
            excludeChunks: ['interview']
        }),
        new webpack.DefinePlugin({ //export all environment variables
            //todo check that if this is really working
            'process.env': {
                DENEME: JSON.stringify("mesut"),
                APPCONFIG: JSON.stringify(confParams)
            }
        })
    ],

Webpack多页面应用服务

0 个答案: