🌐 語言
prettier-plugin-classnames
一個 Prettier 外掛，根據 printWidth 選項自動換行冗長的 class 名稱。
安裝[^1]
npm install -D prettier prettier-plugin-classnames[^1]: 如果您的 prettier-plugin-classnames 版本低於 0.4.0，您還需要安裝 @prettier/sync。
設定
JSON 範例：
{
"plugins": ["prettier-plugin-classnames"]
}JS 範例（CommonJS 模組）：
module.exports = {
plugins: ['prettier-plugin-classnames'],
customAttributes: ['myClassProp'],
customFunctions: ['clsx'],
};JS 範例（ES 模組）：
export default {
plugins: ['prettier-plugin-classnames'],
endingPosition: 'absolute',
};選項
自訂屬性
包含類名的屬性列表。
即使未指定任何選項，也始終支援 class 和 className 屬性。
預設值 | CLI 覆寫 | API 覆寫
--- | --- | ---
[] | --custom-attributes | customAttributes: ["
自訂函式
包含類名的函式列表。
即使未指定任何選項，也始終支援 classNames 函式。
預設值 | CLI 覆寫 | API 覆寫
--- | --- | ---
[] | --custom-functions | customFunctions: ["
結尾位置
首次於 v0.5.0 提供。
absolute-with-indent 於 v0.6.0 新增。
absolute-with-indent 於 v0.8.0 移除，但你可以使用 absolute 取得相同輸出。
預設值在 v0.8.0 從 relative 改為 absolute。
這是當用多行類名取代原本類名時，每行類名的結尾判斷標準。
absolute範例：
--------------------------------------------------| printWidth=50
export function Callout({ children }) {
return (
{children}
);
}
``
範例：
`
--------------------------------------------------| printWidth=50
export function Callout({ children }) {
return (
{children}
);
}
`
預設值 | CLI 覆寫 | API 覆寫
--- | --- | ---
| --ending-position | endingPosition: ""語法轉換
首次於 v0.7.7 提供。
如果在以非運算式語法撰寫的類別名稱中發生換行，則會將其轉換為運算式語法。此轉換不支援可逆格式化。
預設值 | CLI 覆寫 | API 覆寫
--- | --- | ---
| --syntax-transformation | syntaxTransformation: 與同類外掛的版本對應關係
自
起，當其中一方有次要版本釋出時，若可能，計畫於另一方也反映該變更。
與其他 Prettier 外掛的相容性
若有多個 Prettier 外掛可處理您要格式化的文字，Prettier 只會使用最後一個外掛。
此時，您可透過加入 prettier-plugin-merge 來依序套用這些外掛，設定方式如下。
JSON 範例：
--- Tranlated By Open Ai Tx | Last indexed: 2025-09-09 ---