3

我在使用 webpack-dev-server 编译我的资产时遇到了性能问题。出于某种原因,webpack-dev-server 的重建速度非常慢。webpack -watch 大约快 90%。

我的 webpack 配置:

var webpackConfig = {
                    entry: {
                        router: [
                            'webpack-dev-server/client?https://localhost:3000',
                            'webpack/hot/only-dev-server',
                            '<%= pkg.main %>'
                        ]
                    },
                    output: {
                        filename: './js/v2/bundle.js',
                        publicPath: 'https://localhost:3000/'
                    },
                    module: {
                        loaders: moduleLoaders
                    },
                    resolve: {
                        root: jsFilePaths,
                        extensions: ['', '.js', '.jsx', '.css'],
                        alias: webpackAlias,
                        fallback: ["./node_modules"]
                    },
                    resolveLoader: {
                        root: path.join(__dirname, "node_modules")
                    },
                    devtool: 'eval-source-map',
                    watch: true,
                    profile: true,
                    json: true,
                    cache: true,
                    keepAlive: true,
                    plugins: [
                        new webpack.NoErrorsPlugin(),
                        new webpack.HotModuleReplacementPlugin()
                    ]
                };

我的 webpack-dev-server 配置(使用 grunt):

"webpack-dev-server": {
        options: {
            webpack: webpackConfig,
            publicPath: webpackConfig.output.publicPath,
            port: 3000,
            https:true,
            host: "localhost",
            contentBase: "https://localhost",
            hot: true,
            headers: { 'Access-Control-Allow-Origin': '*' }
        },
        start: {
            keepAlive: true
        }

看起来 webpack-dev-server 没有正确使用它的缓存或其他东西。任何想法都会对他有帮助。

4

1 回答 1

4

问题在于解决:root。

原始 jsFilePaths:

var jsFilePaths = [
                        'js/v2/components',
                        'js/v2/components/shared'
                    ];

新的 jsFilePaths:

var jsFilePaths = [
                        __dirname + path.sep + 'js\\v2\\components',
                        __dirname + path.sep + 'js\\v2\\components\\shared'
                    ];

显然,这仅在您使用 Windows 时才需要。如果路径是 unix 格式,Webpack 似乎不会遍历依赖项。

于 2015-11-04T23:17:43.057 回答