Webpack 提取文本插件 - css-Webpack 节点 API 中的加载程序问题

Question

我要实现的目标如下：我有一个快速服务器，在 webhook 上，它应该重新生成我的静态生成的 Web 应用程序。我正在使用 webpack 来这样做。如果我从 webpack 的 CLI 生成静态站点，一切都非常顺利。但是，如果我从节点内导入 webpack 配置，我会收到 Webpack 选项验证错误：

- configuration.module.rules[4].loader should be one of these:
  non-empty string | non-empty string | function | object { loader?, options?, query? } | function | [non-empty string | function | object { loader?, options?, query? }]

稍微调试了一下，发现在我使用WebpackExtractTextPlugin的地方都添加了一个loader，即loader:

{ loader: 1178, options: [Object] }

这是我分享的 webpack.js 的样子：

module.exports = (env) => ({
    context : path.resolve(__dirname, '..', 'entries'),
    output  : {
        path       : path.resolve(__dirname, '..', '..', 'build'),
        filename   : '[name].js',
        publicPath : '/'
    },
    plugins : [
        new webpack.EnvironmentPlugin({
            // ...
        }),
    ],
    module : {
        rules : [
            {
                test    : /\.js$/,
                loader  : 'babel-loader',
                exclude : /node_modules/,
                options : {
                    babelrc : false,
                    presets : ['es2015', 'stage-0', 'react'],
                }
            },
            {
                test   : /\.json$/,
                loader : 'json-loader'
            },
            {
                test   : /\.(jpg|jpeg|png|gif|ico)$/,
                loader : 'file-loader?name=img/[name].[ext]'
            },
            {
                test   : /\.svg$/,
                loader : 'file-loader?name=svg/[name].[ext]'
            },
            {
                test   : /\.less$/,
                loader : ExtractTextPlugin.extract({
                    fallback : 'style-loader',
                    use      : [
                        {
                            loader  : 'css-loader',
                            options : {
                                importLoaders   : 1,
                                modules         : true,
                                minimize        : env !== 'dev',
                                sourceMap       : env === 'dev',
                                discardComments : { removeAll : true },
                                localIdentName  : env === 'dev' ? '[path][name]-[local]-[hash:base64:3]' : '[hash:base64:5]'
                            }
                        },
                        {
                            loader  : 'less-loader',
                            options : {
                                sourceMap  : env === 'dev',
                                modifyVars : lessConfig
                            }
                        }
                    ]
                })
            },
            {
                test   : /\.css$/,
                loader : ExtractTextPlugin.extract({
                    fallback : 'style-loader',
                    use      : {
                        loader  : 'css-loader',
                        options : {
                            minimize  : env !== 'dev',
                            sourceMap : env === 'dev'
                        }
                    }
                })
            }
        ]
    },
    // ...
})

我的 webpack.static.js 将以上内容与此合并：

module.exports = (env) => merge.smart(webpackConfig(env), {
    entry : {
        static : [
            'babel-polyfill',
            './static'
        ]
    },
    output : {
        path          : path.resolve(__dirname, '..', '..', 'build', 'static'),
        libraryTarget : 'umd',
        publicPath    : '/'
    },
    externals : vendorConfig,
    plugins   : [
        new ProgressBarPlugin(),
        new ExtractTextPlugin({
            filename  : 'client.css',
            allChunks : true
        }),
        new StaticSiteGeneratorPlugin({ paths })
    ],
    module : {
        rules : [
            {
                test   : /\.js$/,
                loader : 'babel-loader',
                query  : {
                    presets : ['es2015', 'stage-0', 'react'],
                    plugins : ['system-import-transformer']
                }
            }
        ]
    },
    target : 'node'
})

有谁知道那个额外的加载器可能来自哪里，或者我做错了什么导致这个问题结束？？

我正在使用： webpack@2.2.1 extract-text-webpack-plugin@2.1.0

Answer 1

没关系。问题是我需要来自也被 webpack 捆绑的服务器的 webpack 配置。

我将构建静态站点的部分移到了另一个端口上自己的 script/server 运行中，现在一切都很好:)

Webpack 提取文本插件 - css-Webpack 节点 API 中的加载程序问题

Webpack Extract Text Plugin - css-loader problems in Webpack Node API

webpack-2

extract-text-plugin