一、AppWorks
AppWorks 是一款基于 VS Code 插件的前端研發(fā)工具集。
1)AppWorks Doctor
我試用了其中的代碼質(zhì)量檢測插件,這款插件會依賴 package.json 文件。
所以當前項目的根目錄中需要包含此文件,否則無法運行命令。
在 Mac 環(huán)境中,Ctrl+Shift+P 快捷鍵后彈出命令框,選擇 AppWorks: Scan Your Project,開始掃描當前項目。
我試驗了管理后臺項目,雖然出現(xiàn)了掃描結(jié)果,但是只有 Ali ESLint 給出了打分,里面都是格式問題。
上圖中的可維護性和代碼重復度的分數(shù)并沒有給出。
2)AppWorks CodeMod
AppWorks CodeMod 是一個進行大規(guī)模代碼庫重構(gòu)的插件,也是通過命令來喚起的。
命令框中輸入 AppWorks: CodeMod 激活插件,出現(xiàn)一些重構(gòu)選項,沒有 Vue 代碼的重構(gòu)。
試驗了 React,會對項目進行掃描,然后給出待優(yōu)化的文件路徑,點 Update 按鈕就能自動修改。
不過看不到具體的代碼行數(shù),Next Generation JS 中可以修改 JavaScript 的語法。
例如將 var 替換成 let 或 const、替換成箭頭函數(shù)、使用字符串模板等。
二、jscpd
jscpd 是一款代碼重復檢測工具,可以作為庫使用,可以在終端通過命令來使用。
1)安裝
為了簡單點,我全局安裝了 jscpd。
npm install jscpd -g
全局安裝后,就可以根據(jù)其提供的關(guān)鍵字來組織命令。
jscpd --ignore "**/node_modules/**" --reporters html /Users/code/web/backend_server
在上面的命令中,忽略了 node_modules 目錄中的文件,然后輸出網(wǎng)頁報告,目錄如下。
注意,當前目錄(終端所在的位置)中必須包含 report 文件夾,否則無法輸出報告。
2)報告
運行命令后,會在終端看到兩兩比對,輸出重復代碼的文件路徑,并且給出了詳細的行數(shù),例如 416 和 348 行。
我將 server 項目掃描了一遍,有 682 個文件包含了 429 段重復代碼,總行數(shù) 8172 ,重復率占 10.89%。
有些重復代碼可以不用關(guān)注,例如數(shù)據(jù)庫字段的聲明。
有些重復代碼可以做針對性的優(yōu)化,降低復制黏貼的頻率。
但工作量還是有點的,并且在重構(gòu)后,還需要對原功能做驗證。文章來源:http://www.zghlxwxcb.cn/news/detail-444979.html
?文章來源地址http://www.zghlxwxcb.cn/news/detail-444979.html
到了這里,關(guān)于從零開始搞基建(5)——代碼質(zhì)量的文章就介紹完了。如果您還想了解更多內(nèi)容,請在右上角搜索TOY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章,希望大家以后多多支持TOY模板網(wǎng)!