1.看这边文章之前,先给大家看下我这边这几个包的版本吧
注意看下husky这个版本,husky新版本和旧版本的用法是不一样的,husky(6.0.0)已经做了破坏性的变更,之前的设置方式已经失效了,所以才有可能导致你在commit的时候没有生效。这是导致我出现问题的根本原因,解决办法呢也很简单,在package.json中的script脚本中加入这句 然后运行下
npm run prepare
这个命令,该命令会在src同级目录下创建.husky/目录并指定该目录为git hooks所在的目录。
然后在运行下下面这个命令就会在.husky下面生成一个pre-commit脚本
npx husky add .husky/pre-commit "npm run lint-staged"
?这个脚本就是你在git commit 的时候他就会运行这个脚本执行? npm run lint-staged这个命令,这时候就解决了pre-commit不生效的问题。
下面我就给大家说下我怎样重头开始到配置完成的办法吧。
首先先安装下相应的工具:
npm install -D stylelint prettier eslint husky
// yarn
yarn add stylelint prettier eslint husky -D
然后在根目录下创建相应的文件
.stylelintrc.js文件配置
const fabric = require('@umijs/fabric');
module.exports = {
...fabric.stylelint,
};
<---------------------------------------->
.eslintrc.js文件配置
module.exports = {
extends: [require.resolve('@umijs/fabric/dist/eslint')]
};
<---------------------------------------->
.eslintignore配置
.eslintrc.js
node_modules
package.json
<---------------------------------------->
.prettierrc.js文件配置
const fabric = require('@umijs/fabric');
module.exports = {
...fabric.prettier,
singleQuote: true,
trailingComma: 'es5',
printWidth: 100,
overrides: [
{
files: '.prettierrc',
options: { parser: 'json' },
},
],
};
<---------------------------------------->
.prettierignore文件配置
**/*.md
**/*.svg
**/*.ejs
**/*.html
package.json
.umi
.umi-production
.umi-test
node_modules
最后就是package.json文件
"scripts": {
......
//这里我省略了很多,只看下面的就行
"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 \"**/*\"",
"prepare": "husky install"
},
"husky": {
"hooks": {
"pre-commit": "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",
]
},
配置完成之后呢就先运行下上面那两个命令npm run prepare和npx husky add .husky/pre-commit "npm run lint-staged" 然后就可以了。 本文写的有点粗糙,有很多不足之处还望谅解,欢迎留言
|