我正在使用一个React模板,目前有一行代码让我非常困惑,原因有很多。
require('file-loader?name=[name].[ext]!./index.html');
- 首先,为什么在入口点应用程序文件中需要使用file-loader?
name=[name]
参数是做什么的?感叹号代表什么意思?
我正在使用一个React模板,目前有一行代码让我非常困惑,原因有很多。
require('file-loader?name=[name].[ext]!./index.html');
name=[name]
参数是做什么的?
感叹号代表什么意思?
file-loader
),它被 内联使用。
当 Webpack loader 被内联使用时,而不是通过 Webpack 配置文件的 module.rules
数组中的对象使用,要使用的 loader 名称将被添加到要 require(或 import)的文件名称前面,用 !
分隔。要传递给 loader 的任何选项都会作为查询字符串或 JSON 字符串指定在 loader 名称后面,用 ?
分隔 loader 名称和 loader 选项。
由于 file-loader
复制文件到 Webpack 输出目录并返回其 URL,require("file-loader?name=[name].[ext]!./index.html")
将 ./index.html
以其原始名称和扩展名复制到输出目录。如果调用 require
的结果被分配给任何变量,在这种情况下它将返回 /index.html
(如果在您的 Webpack 配置文件中设置了公共路径,则会加上前缀)。