关于webpack dllPlugin的问题，内容有点长

Question

目的

将项目中使用的一些第三方库，单独封到一个文件中，避免编译时重复编译这些库，缩短编译时间。

config

dllPlugin 配置文件

// dll
var path = require("path");
var webpack = require("webpack");

module.exports = {
    entry: {
        vendor: ['react', 'react-dom', 'react-router', 'react-redux', 'react-router-redux', 'redux', 'redux-thunk']
    },
    output: {
        path: path.join(__dirname, "dist"),
        filename: "[name].dll.js",
        library: "[name]"
    },
    plugins: [
        // new webpack.DllPlugin({
        //     path: path.join(__dirname, "dll", "[name]-manifest.json"),
        //     name: "[name]",
        //     context: __dirname
        // }),
        // new webpack.optimize.OccurrenceOrderPlugin(),
        // new webpack.optimize.UglifyJsPlugin()
        new webpack.DllPlugin({
            path: 'manifest.json',
            name: '[name]',
            context: __dirname,
        })
    ]
};

webpack 配置文件

// webpack
const path = require('path');
const webpack = require('webpack');
const HtmlWebpackPlugin = require('html-webpack-plugin');
const ExtractTextPlugin = require("extract-text-webpack-plugin");

module.exports = {
    entry: {
        Route: './modules/Route',
        // vendor: ['react', 'react-dom', 'react-router', 'react-redux', 'react-router-redux', 'redux', 'redux-thunk']
    },
    output: {
        path: path.resolve(__dirname, 'dist'),
        filename: '[name].js',
        publicPath: '/dist/'
    },
    module: {
        loaders: [
            {
                test: /\.js$/,
                loader: ['es3ify-loader', 'babel-loader'],
                exclude: /node_modules/
            }, {
                test: /\.css$/,
                loader: ExtractTextPlugin.extract({
                    fallback: ["style-loader", "postcss-loader"],
                    use: ["css-loader"]
                })
            }, {
                test: /\.(jpe?g|png|gif|svg|bmp)$/i,
                loader: 'url-loader?limit=8192&name=images/[hash:8].[ext]'
            }]
    },
    devServer: {
        historyApiFallback: true,
        disableHostCheck: true,
        hot: false,
        inline: false,
        progress: true
    },
    resolve: {
        extensions: ['.js', '.css']
    },
    plugins: [
        // new webpack.optimize.CommonsChunkPlugin({
        //     name: 'vendor'
        // }),
        new webpack.DefinePlugin({
            'process.env': {
                NODE_ENV: JSON.stringify('development')
            }
        }),
        new HtmlWebpackPlugin({
            title: 'react',
            filename: 'index.html',
            template: './templates/index.html',
            hash: true,
            favicon: './images/favicon.ico',
            // 指定要加载的模块
            chunks: ['Route']
        }),
        // 分割require的css文件，重命名为style.css 并引入(只能分割一个css文件)
        new ExtractTextPlugin({
            allChunks: true,
            filename: "[name].css"
        }),
        new webpack.DllReferencePlugin({
            context: __dirname,
            manifest: require("./manifest.json")
        })
    ]
}

express server.js

// server.js
var path = require('path');
var express = require('express');
var webpack = require('webpack');
var config = require('./webpack.dev.config.js');

var app = express();
var compiler = webpack(config);

app.use(require('webpack-dev-middleware')(compiler, {
    noInfo: true,
    publicPath: config.output.publicPath
}));

app.use(require('webpack-hot-middleware')(compiler));

app.use('/public', express.static('public'));

app.get('*', function(req, res) {
    res.sendFile(path.join(__dirname, '/dist/index.html'));
});

app.use(express.static(path.join(__dirname, 'public')));

app.listen(3002, function(err) {
    if (err) {
        console.log(err)
        return;
    }
});

主要问题

• HtmlWebpackPlugin 中是否能直接配置引入编译好的dll文件？

• 用express 起服务的时候，又重新读了一次webpack配置文件，如果手动引入编译后的dll文件，并不能找到，有没有什么解决办法？

console