StylelintWebpackPlugin
此版本的 stylelint-webpack-plugin 僅適用於 webpack 5。對於 webpack 4，請參閱 2.x 分支。
此外掛程式使用 stylelint，它有助於您避免錯誤並在樣式中強制執行慣例。
入門
首先，您需要安裝 stylelint-webpack-plugin
npm install stylelint-webpack-plugin --save-dev
或
yarn add -D stylelint-webpack-plugin
或
pnpm add -D stylelint-webpack-plugin
注意:
如果您尚未安裝，您還需要從 npm 安裝
stylelint >= 13
npm install stylelint --save-dev
或
yarn add -D stylelint
或
pnpm add -D stylelint
注意:
如果您使用的是 Stylelint 13 而不是 14+，您可能還需要安裝
@types/stylelint作為開發依賴項，如果取得與 stylelint 相關的類型錯誤。
然後將外掛程式新增到您的 webpack 設定檔。例如
const StylelintPlugin = require('stylelint-webpack-plugin');
module.exports = {
// ...
plugins: [new StylelintPlugin(options)],
// ...
};選項
請參閱 stylelint 的選項 以取得可用選項的完整清單。這些選項會直接傳遞到 stylelint。
cache
- 類型
type cache = boolean;- 預設值：
true
預設啟用快取以減少執行時間。
cacheLocation
- 類型
type cacheLocation = string;- 預設值：
node_modules/.cache/stylelint-webpack-plugin/.stylelintcache
指定快取位置的路徑。可以是檔案或目錄。
configFile
- 類型
type context = string;- 預設值：
undefined
指定 stylelint 要使用的設定檔位置。
注意
預設由
stylelint處理。
context
- 類型
type context = string;- 預設值：
compiler.context
表示檔案根目錄的字串。
exclude
- 類型
type exclude = string | Array<string>;- 預設值：
['node_modules', compiler.options.output.path]
指定要排除的檔案和/或目錄。必須相對於 options.context。
extensions
- 類型
type extensions = string | Array<string>;- 預設值：
['css', 'scss', 'sass']
指定應檢查的副檔名。
files
- 類型
type files = string | Array<string>;- 預設值：
null
指定目錄、檔案或 glob。必須相對於 options.context。目錄會遞迴搜尋符合 options.extensions 的檔案。檔案和 glob 模式會忽略 options.extensions。
fix
- 類型
type fix = boolean;- 預設值：
false
如果為 true，stylelint 將修正儘可能多的錯誤。修正會套用至實際的原始檔案。所有未修正的錯誤將會回報。請參閱 自動修正錯誤 文件。
formatter
- 類型
type formatter = string | (
results: Array<import('stylelint').LintResult>
) => string- 預設值：
'string'
指定您想要用來格式化結果的格式化程式。請參閱 formatter 選項。
lintDirtyModulesOnly
- 類型
type lintDirtyModulesOnly = boolean;- 預設值：
false
僅檢查已變更的檔案，在開始時略過檢查。
stylelintPath
- 類型
type stylelintPath = string;- 預設值：
stylelint
將用於檢查的 stylelint 實例路徑。
threads
- 類型
type threads = boolean | number;- 預設值：
false
設為 true 以根據 CPU 數量自動選擇池大小。設為大於 1 的數字以設定明確的池大小。設為 false、1 或更小以停用並僅在主程序中執行。
錯誤和警告
預設情況下，外掛程式會根據 stylelint 錯誤/警告數量自動調整錯誤回報。您仍可以使用 emitError 或 emitWarning 選項強制此行為
emitError
- 類型
type emitError = boolean;- 預設值：
true
找到的錯誤將永遠發出，若要停用，請設定為 false。
emitWarning
- 類型
type emitWarning = boolean;- 預設值：
true
找到的警告將永遠發出，若要停用，請設定為 false。
failOnError
- 類型
type failOnError = boolean;- 預設值：
true
如果有任何錯誤，將導致模組建置失敗，若要停用，請設定為 false。
failOnWarning
- 類型
type failOnWarning = boolean;- 預設值：
false
如果設定為 true，如果有任何警告，將導致模組建置失敗。
quiet
- 類型
type quiet = boolean;- 預設值：
false
如果設定為 true，將只處理並報告錯誤，而忽略警告。
outputReport
- 類型
type outputReport =
| boolean
| {
filePath?: string | undefined;
formatter?:
| (
| string
| ((results: Array<import('stylelint').LintResult>) => string)
)
| undefined;
};- 預設值：
false
將錯誤輸出寫入檔案，例如 json 檔案以供報告使用。filePath 相對於 webpack 設定：output.path。你可以傳入不同的格式化程式處理輸出檔案，如果沒有傳入，將使用預設/已設定的格式化程式。
{
filePath: 'path/to/file';
formatter: 'json';
}