stylelint-webpack-plugin 3.0 仅支持 webpack 5。对于 webpack 4,请查看 2.x 分支。
该插件使用 stylelint 帮助你在样式代码中避免错误并强制规范。
首先,你需要安装 stylelint-webpack-plugin:
npm install stylelint-webpack-plugin --save-dev注意:如果你还没有安装 stylelint >= 13,请先用 npm 进行安装:
npm install stylelint --save-dev然后添加该插件到你的 webpack 配置中。例如:
const StylelintPlugin = require('stylelint-webpack-plugin');
module.exports = {
// ...
plugins: [new StylelintPlugin(options)],
// ...
};有关可用选项的完整列表请参阅 styleint 的配置项,这些选项直接传递给 stylelint。
configFileStringundefined指定 stylelint 配置文件的位置。
注意: 默认情况下由 stylelint 处理。
contextStringcompiler.context指定文件根目录的字符串。
excludeString|Array[String]['node_modules', compiler.options.output.path]指定要忽略的文件或目录。必须相对于 options.context。
extensionsString|Array[String]['css', 'scss', 'sass']指定要检查的扩展名。
filesString|Array[String]'**/*.(s(c|a)ss|css)'可指定为目录,文件名或 globs。目录会递归地寻找与 options.extensions 相匹配的文件。文件名和 glob 模式将忽略 options.extensions。
fixBooleanfalse如果值为 true,stylelint 将修复尽可能多的 error。修复真实的源文件。报告所有未修复的 errors。请参阅 自动修复错误 文档。
formatterString|Function'string'指定要用于格式化结果的 formatter。请参阅 formatter 选项。
lintDirtyModulesOnlyBooleanfalse仅检查有变化的文件,启动时跳过检查。
stylelintPathStringstylelint将要用来做检查的 stylelint 实例的路径。
threadsBoolean | Numberfalse设置为 true 时,会根据 cpu 的数量自动决定池子的大小。设置为大于 1 的数字时,可以确定池子的大小。设置为 false、1 或更小时,会禁用池子,并只在主线程运行。
默认情况下,插件将根据 stylelint 错误/警告数量自动调整错误报告。
你仍然可以使用 emitError 或 emitWarning 选项来强制改变这种默认行为。
emitErrorBooleantrue如遇到错误将会被直接输出,如需禁用,请设置为 false。
emitWarningBooleantrue如遇到警告将会被直接输出,如需禁用,请设置为 false。
failOnErrorBooleantrue如果有任何错误,都将导致模块构建失败,如需禁用,请设置为 false。
failOnWarningBooleanfalse如果设置为 true,出现任何 warnings 都将会导致模块构建失败。
quietBooleanfalse如果设置为 true,则仅处理和报告 errors,并忽略 warnings。
outputReportBoolean|Objectfalse将输出的错误写入文件,例如,用于上报的 json 文件。
其 filePath 会相对于 webpack 配置中的:output.path.
你可以为输出文件设置不同的 formatter,如果未设置,则将使用默认 formatter。
{
'path/to/file';
'json';
}