Vue3基于husky的代碼檢查工作流
husky是一個git hooks工具(git的鉤子工具,可以在特定時機執(zhí)行特定的命令)
代碼檢查
背景:想要使代碼上傳到git倉庫前進行代碼檢查,所以提前下載好git
打開項目終端,點擊右上角選擇進入Git Bash控制
1.如果當(dāng)前項目沒有被git進行管理,就需要先初始化git倉庫,執(zhí)行g(shù)it init即可;如果不初始化直接進行husky處理肯定是不行的
git init
2.初始化husky工具配置
官網(wǎng):https://typicode.github.io/husky/
pnpm dlx husky-init&&pnpm install
配置成功后,會出現(xiàn).husky文件,可以點進pre-commit文件查看
3.修改.husky/pre-commit文件
將npm test修改為pnpm lint,只要一提交代碼就會觸發(fā)這個pnpm lint(代碼校驗)
如果項目中有代碼不符合規(guī)范,在提交到倉庫時就會有報錯提示
問題:pnpm lint是全量檢查,耗時問題(文件量大時),歷史問題(前期代碼并沒有使用規(guī)范)
暫存區(qū)eslint校驗(解決上面問題,企業(yè)級項目更常用)
只用對自己寫的代碼負責(zé)
1.安裝lint-staged包
pnpm i lint-staged -D
2.package.json配置lint-staged命令
在圖中紅色區(qū)域里添加如下代碼:
"lint-staged": { "*.{js,ts,vue}": [ "eslint --fix" ] }
"lint-staged": "lint-staged"
3..husky/pre-commit文件修改
將pnpm lint修改為pnpm lint-staged
到此這篇關(guān)于Vue3-基于husky的代碼檢查工作流的文章就介紹到這了,更多相關(guān)Vue3代碼檢查工作流內(nèi)容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
相關(guān)文章
vue實現(xiàn)登錄后頁面跳轉(zhuǎn)到之前頁面
本文給大家分享了vue實現(xiàn)登錄后頁面跳轉(zhuǎn)到之前頁面的一個功能,有這方便需要的朋友學(xué)習(xí)參考下吧。2018-01-01vue在自定義組件上使用v-model和.sync的方法實例
自定義組件的v-model和.sync修飾符其實本質(zhì)上都是vue的語法糖,用于實現(xiàn)父子組件的"數(shù)據(jù)"雙向綁定,下面這篇文章主要給大家介紹了關(guān)于vue在自定義組件上使用v-model和.sync的相關(guān)資料,需要的朋友可以參考下2022-07-07解決Vue的項目使用Element ui 走馬燈無法實現(xiàn)的問題
這篇文章主要介紹了解決Vue的項目使用Element ui 走馬燈無法實現(xiàn)的問題,具有很好的參考價值,希望對大家有所幫助。一起跟隨小編過來看看吧2020-08-08