项目创建——代码规范prettier, commitlint

preitter

在这里插入图片描述

首先安装

在这里插入图片描述
运行后应该是这样
在这里插入图片描述
prettierrc就是用来写规则的文件,ignore顾名思义就是忽略哪些文件。

第二,预提交钩子

在这里插入图片描述
执行npx mrm lint-staged。它会在代码每次提交之前,进行格式化。

在这里插入图片描述
对所有js css md ts tsx文件都会使用piettier格式化代码。

兼容eslint

在这里插入图片描述
prettier工作的时候跟eslint有一些冲突,所以我们要安装这个。在这里插入图片描述
再在eslint的规则后面加上prettier,表示eslint工作的时候用prettier的一些规则。

实验

在这里插入图片描述
代码杂乱无章,运行 git add . , 运行git commit -m “”
在这里插入图片描述
Commit完在这里插入图片描述
可以看到已经成功格式化了。
如果你遇到这个问题,可能是
在这里插入图片描述
vscode的编码设置为utf-16LE,需要改为utf-8 然后重新建下commitlint.config.js文件。
在这里插入图片描述
在这里可以配置

配置commitlint

https://github.com/conventional-changelog/commitlint
在这里插入图片描述
安装
npm install --save-dev @commitlint/config-conventional @commitlint/cli
在命令行运行
echo “module.exports = {extends: [’@commitlint/config-conventional’]}” > commitlint.config.js
可以看到出现这个文件
在这里插入图片描述
在commit之前检查
在这里插入图片描述
利用这个commit-msg hooks
husky我们是安装了的,所以直接执行最后一行
在这里插入图片描述
在这里插入图片描述然后执行
在这里插入图片描述
在这里插入图片描述
失败了,我们必须按他的规则来
在这里插入图片描述
在这里插入图片描述
成功,这样commitlint也配置好了。

猜你喜欢

转载自blog.csdn.net/lin_fightin/article/details/120896046