加载程序不按时间顺序编译

Question

来自文档：

加载器链按时间顺序编译。第一个加载器中的 加载器链返回一个值给下一个。

让我们以下面的 webpack 配置为例。

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

根据文档，style-loader首先运行，然后将其输出通过管道传输到css-loader(由于时间顺序(。但这不是它的工作原理。实际上，css-loader首先加载样式表，然后将结果通过管道传输到style-loader然后将它们附加到 html 页面。

如果我更改加载器的顺序，则在构建时会出现错误：

 { loader: 'css-loader'},
 { loader: 'style-loader'}

错误：

ERROR in ./src/style.css
Module build failed: Unknown word (5:1)
  3 | // load the styles
  4 | var content = require("!!./style.css");
> 5 | if(typeof content === 'string') content = [[module.id, content, '']];
    | ^
  6 | // Prepare cssTransformation
  7 | var transform;
  8 | 
 @ ./src/index.js 1:14-36

我错过了什么？难道我的时间顺序不正确吗？

Answer 1

这里有不同的文档

当链接多个加载器时，重要的是要记住它们以相反的顺序执行 - 从右到左或从下到上，具体取决于数组格式。

现在它有意义了