gulp - 使用 Webpack 连接和缩小 CSS 文件而不需要它们

Question

我有一个应用程序的旧部分，其中包含一些使用 gulp 脚本连接和缩小的 CSS 文件。

我有一个与 Webpack bundle 在一起的新应用程序。

是否可以在没有任何额外的 require 调用的情况下使用 Webpack 组装旧的 CSS？只需从 old_css/**/*.css 中获取所有 CSS，连接、缩小并写入 assets/old.css？

Answer 1

您可以通过单独的 entry“要求”CSS 文件来实现此目的。 .你最终会得到这样的结果:

{
    entry: {
        styles: glob('old_css/**/*.css'), // array of css files
        ...
    },
    output: {
        filename: '[name].[chunkhash].js',
        ...
    },
    module: {
        loaders: [
            {
                test: /\.css$/,
                loader: ExtractTextPlugin.extract("style-loader", "css-loader")
            },
            ...
        ]
    },
    plugins: [
        new ExtractTextPlugin('[name].[chunkhash].css'),
        ...
    ],
    ...
}

除了 CSS 文件之外，您最终还会得到一个以您的样式条目命名的 JavaScript 文件。不过，你可以忽略它。