1.0.16 • Published 3 years ago
eslint-config-benson v1.0.16
LionGroup-Config
eslint 引用方法
- 安裝 vscode 插件
- 安裝 npm 套件
npm i -D eslint-config-alloy eslint-plugin-react eslint-plugin-react-hooks
- 建立設定檔
在根目錄下的建立一個 .eslintrc(.json)
檔案
並加入以下擴充
module.expoorts = {
extends: ["benson"],
rules: {
/* 你的自訂規則 */
},
};
TypeScript 規則
- Enum, Type, Interface 須以 E_ , T_ , I_ 開頭,
- Enum 只接受大寫和 _
正確的寫法
enum E_NUMBERS {
One,
Two,
}
type T_Names = {
first: string;
};
interface I_Eamil {
first: string;
}
錯誤的寫法
// 名稱含小寫
enum E_Numbers {
One,
Two,
}
// 沒有以 T_ 開頭
type Names = {
first: string;
};
// 沒有以 I_ 開頭
interface Email {
first: string;
}
Prettier
- 安裝 vscode 插件
- 建立設定檔
.prettierrc.js
module.exports = {
...require("eslint-config-benson/prettier-config"),
/**
* 以下為你的自訂規則
*/
semi: false,
};
Stylelint
- 安裝 vscode 插件
- 下載 npm 套件
npm i -D stylelint
- 建立設定檔
.stylelintrc(.json)
{
"extends": "eslint-config-benson/stylelint.config"
}
搭配 Styled-Components
請下載
npm i -D stylelint-processor-styled-components
- stylelint-processor-styled-components:將樣式從 styled-components 抽出
並在 .stylelintrc.json 加入
{
"processors": ["stylelint-processor-styled-components"],
"extends": ["eslint-config-benson/stylelint.config"],
"rules": [
/* 你的自訂規則 */
]
}
參考資源
eslint
- https://medium.com/onedegree-tech-blog/%E5%BB%BA%E7%AB%8B%E5%85%AC%E5%8F%B8%E5%85%A7%E9%83%A8%E4%BD%BF%E7%94%A8%E7%9A%84-eslint-config-package-4b76c089848
- https://github.com/AlloyTeam/eslint-config-alloy/blob/master/README.zh-CN.md
- https://github.com/yannickcr/eslint-plugin-react
prettier