eslint：code quality linter
prettier: code formatter

二者結(jié)合使用既能達(dá)到團(tuán)隊(duì)代碼協(xié)作風(fēng)格一致(比如空格寬度，縮進(jìn)等)，又能做代碼檢查。

今天遇到一個(gè)問題：使用eslint時(shí)，通常為了約束開發(fā)人員，會同時(shí)使用pre-commit（利用git hooks），在commit之前如果eslint檢查不通過則無法提交。

而在加入prettier的時(shí)候，希望能在代碼提交的時(shí)候prettier能自動格式化我的代碼文件，然后再提交。因此加入了husky+lint-staged配和實(shí)現(xiàn)。husky也利用了git hooks.

結(jié)果這兩個(gè)git hooks只有一個(gè)起到了作用。

為了達(dá)到既能自動格式化代碼，又能攔截eslint錯誤提交，可以保留pre-commit，然后將lint-staged加入pre-commit中，此時(shí)可以移除husky了。

修改package.json如下：
package.json:

"scripts": {"lint": "node ./node_modules/.bin/eslint src","precommit": "lint-staged"}, "pre-commit": ["precommit","lint"],"lint-staged": {"**/**.{js,json,pcss,md}": ["prettier --write","git add"]},

安裝eslint-config-prettier(eslint-plugin-prettier 和 eslint-config-prettier 以及both 中，選擇了eslint-config-prettier):

npm i eslint-config-prettier -D

修改.eslintrc，使得format規(guī)則沖突時(shí)以prettier為準(zhǔn):

{"extends": ["eslint-config-recommended", "prettier"],"rules": {"eqeqeq": "off"} }

這樣就能完美結(jié)合了。

總結(jié)

以上是生活随笔為你收集整理的代码规范之eslint+prettier实践的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。