0

来自文档：

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

让我们以下面的 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

我错过了什么？我没有正确理解时间顺序吗？

4

1 回答 1

1

这是不同的文档

当多个加载器被链接时，重要的是要记住它们以相反的顺序执行——根据数组格式从右到左或从下到上。

现在它是有道理的

于 2017-12-30T12:59:01.683 回答