iT邦幫忙

2018 iT 邦幫忙鐵人賽
DAY 22
0

今天插播一個主題,我為了這個鐵人賽正在將原始碼重新寫過,在這段時間我知道了 ESLint 這個代碼檢查工具,想說來裝一下,讓自己寫的代碼更符合標準。

我採用熱門的eslint-config-airbnb,用的是VSCode編輯器,平常使用 Yarn 這個 package manager。一開始我先把需要的 packages 都裝在 global,Airbnb 這個套件有規定 peer dependency, 也就是說有規定引用套件的版本,不能直接裝最新版,雖然好像還是可以用,不過會跳一堆警告。

這個套件需要 eslint, eslint-plugin-react, eslint-plugin-import, eslint-plugin-jsx-a11y 4個套件,輸入npm info "eslint-config-airbnb@latest" peerDependencies 可以得知各套件的版本,然後再裝在 global裡。

VSCode 也要裝 ESLint extension, 在settings將eslint.packageManager改成yarn後理應當重啟VSCode就能在編輯器內看到錯誤的標示,但是在 VSCode output 卻還是說找不到 global 的 ESLint library, 但是直接在 terminal 用 $ eslint 去檢查檔案卻可以。

我後來還是把 Yarn 的部份刪除,用NPM重新安裝上述的套件,使用起來都正常了。


上一篇
CSS
下一篇
Gallery
系列文
如何在前端開發流程中加入使用者經驗設計 - 以線上相簿為例30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言