loader

例如，你可以使用 loader 告诉 webpack 加载 CSS 文件，或者将 TypeScript 转为 JavaScript。为此，首先安装相对应的 loader：

然后指示 webpack 对每个 .css 使用 css-loader，以及对所有 .ts 文件使用：

webpack.config.js

在你的应用程序中，有三种使用 loader 的方式：

loader 从右到左地取值(evaluate)/执行(execute)。在下面的示例中，从 sass-loader 开始执行，然后继续执行 css-loader，最后以 style-loader 为结束。查看了解有关 loader 顺序的更多信息。

可以在 import 语句或任何等同于 “import” 的方法中指定 loader。使用将资源中的 loader 分开。每个部分都会相对于当前目录解析。

使用 ! 为整个规则添加前缀，可以覆盖配置中的所有 loader 定义。

选项可以传递查询参数，例如 ?key=value&foo=bar，或者一个 JSON 对象，例如 ?{"key":"value","foo":"bar"}。

还可以通过 CLI 使用 loader：

这会对 .jade 文件使用 jade-loader，以及对 .css 文件使用和。

loader 可以是同步的，也可以是异步的。
loader 运行在 Node.js 中，并且能够执行任何 Node.js 能做到的操作。
loader 可以通过 options 对象配置（仍然支持使用 query 参数来设置选项，但是这种方式已被废弃）。
除了常见的通过 package.json 的 main 来将一个 npm 模块导出为 loader，还可以在 module.rules 中使用 loader 字段直接引用一个模块。
插件(plugin)可以为 loader 带来更多特性。

通过（loader）预处理函数，loader 为 JavaScript 生态系统提供了更多能力。用户现在可以更加灵活地引入细粒度逻辑，例如：压缩、打包、语言翻译和。

loader 遵循模块解析标准。多数情况下，loader 将从加载（通常是从 npm install, node_modules 进行加载）。