javascript - Style-Loader 可用功能在 Webpack 2.x 中不起作用

Question

我正在使用 Webpack ^2.2.1 和 Style-Loader ^0.13.2。

我的 Webpack 配置中的 .css 文件规则如下所示:

            {
                test:       /\.css$/,
                use: [
                    { loader: 'style-loader', options: { useable: true } },
                    { loader: 'css-loader' }
                ]
            }

现在，当我异步导入(以前的require.ensure、System.import)一个css文件时，您收到的是一个对象，而不是原始 css 数据，附加方法:use() 和 unuse()(因为 useable 选项设置为 正确)。

    import( './mod1.css' ).then( cssRaw => {
        setTimeout(() => {
            // let's assume an async use case
            cssRaw.use();
        },3000);
    });

但是，这对我来说不再起作用了(Uncaught TypeError: cssRaw.use is not a function)。

事实上，import(以前的System.import)在这里提供的对象并不拥有这样的方法。

我在这里做错了什么或者 Webpack 2.x 中有什么变化吗？ 这个确切的代码事先可以正常工作。

---

正如到目前为止的答案中提到的，将加载器字符串传递为

{ loader: 'style-loader/useable' }

按预期工作。如果这是应该走的路，我想“ recommended configuration for style-loader in 2.x ”是非常错误的。

---

我在 Webpack github 页面上提交了一个问题，该问题已被接受并于今天得到修复 ( https://github.com/webpack-contrib/style-loader/pull/185/commits )。

Answer 1

将加载器配置更改为以下内容:

{
    test: /\.css$/,
    use: [
        { loader: 'style-loader/useable' },
        { loader: 'css-loader' }
    ]
}

可用似乎不是一个选项，而是一个加载器本身，可以在 style-loader 模块目录中使用。