vscode插件安裝
安裝依賴
npm install -D stylelint prettier eslint
// yarn
yarn add stylelint prettier eslint -D
stylelint
- .stylelintrc.js文件配置
const fabric = require('@umijs/fabric');
module.exports = {
...fabric.stylelint,
};
eslint
- .eslintrc.js文件配置
module.exports = {
extends: [require.resolve('@umijs/fabric/dist/eslint')]
};
prettier
- .prettierrc.js文件配置
const fabric = require('@umijs/fabric');
module.exports = {
...fabric.prettier,
};
配置忽略
// .stylelintignore 忽略stylelint檢查的文件
// .prettierignore 忽略prettier檢查的文件
// .eslintignore 忽略eslint檢查的文件
vscode配置
- 添加自動修復
"editor.codeActionsOnSave": {
"source.fixAll": true
}
git commit時檢查
- 安裝依賴
npm install -D lint-staged husky
// yarn
yarn add lint-staged husky -D
- package.json添加相關指令
lint-staged添加git add 意味只檢查本次提交文件否則檢查所有
"lint": "umi g tmp && npm run lint:js && npm run lint:style && npm run lint:prettier",
"lint:prettier": "prettier --check \"**/*\" --end-of-line auto",
"lint-staged": "lint-staged",
"lint-staged:js": "eslint --ext .js,.jsx,.ts,.tsx ",
"lint:fix": "eslint --fix --cache --ext .js,.jsx,.ts,.tsx --format=pretty ./src && npm run lint:style",
"lint:js": "eslint --cache --ext .js,.jsx,.ts,.tsx --format=pretty ./src",
"lint:style": "stylelint --fix \"src/**/*.less\" --syntax less",
"prettier": "prettier -c --write \"**/*\"",
"husky": {
"hooks": {
"pre-commit": "npm run lint-staged"
}
},
"lint-staged": {
"**/*.less": "stylelint --syntax less",
"**/*.{js,jsx,ts,tsx}": "npm run lint-staged:js",
"**/*.{js,jsx,tsx,ts,less,md,json}": [
"prettier --write",
"git add"
]
},