使用CSS Loader

时间:2017-03-16 01:03:02

标签: webpack webpack-2 css-loader sass-loader cssnano

我正在通过Webpack 2构建一个React应用程序,通过SASS-loader和CSS-loader生成CSS。这是我的Webpack 2配置:

loaders: [
        {
            test: /\.(css|scss)$/,
            use: ExtractTextPlugin.extract({
                fallback: 'style-loader',
                use: [
                    {
                        loader: 'css-loader',
                        options: {
                            modules: true,
                            importLoader: 1,
                            camelCase: true,
                            localIdentName: '[local]',
                            minimize: {
                                safe: true,
                            },
                        }
                    },
                    {
                        loader: 'sass-loader'
                    }
                ],
            })
        },
        [...]
     ]

我正在将生成的CSS写入文件,同时允许我的React应用程序在Javascript对象中获取生成的类名以分配给各种HTML元素。

我看到的一个怪癖是没有保留空类(不包含实际样式的类选择器),并且在生成时从类列表中丢弃。我已经读过CSS-loader使用CSSNano,默认情况下,其配置通过缩小来删除未使用的/空类。

根据CSS-Loader的documentation,您可以通过minimize选项设置CSSNano选项。这就是为什么我按照CSSNano的选项documentation设置安全为真的。

不幸的是,仍然没有保留空/未使用的类。我想知道我是否正确地通过了CSSNano选项。

关于为什么空课不持久的任何想法?

0 个答案:

没有答案