初學 ESLint


Posted by estella00911 on 2021-04-26

每個人都有不一樣的 code 風格,或者是在初學的時候,縮排有的會使用 tab 或 space ,此時 ESLint(程式碼規範檢查工具(Linter))就派上用場嚕!可以規範大家的 coding style。

環境設置 與 ESLint安裝與初始化

1. 執行環境:

Node.js
下載 Node.js執行環境,讓 JavaScript 可以在瀏覽器之外的地方執行,網頁有 LTS 跟 current 兩個版本,LTS 為穩定版本,current 為最新版本,只要下載 LTS 版本即可。
安裝完成後,重新打開 Cmder(windows) 或 terminal(MacOs) 後:

$ node -v
v14.16.1  // 出現版本,安裝成功

2. npm 簡介

npm 是 Node Package Manager 的縮寫,可以利用 Node 透過 npm 套件的安裝及管理。

$ npm install // 安裝 npm
//移動到專案底下
$ npm init // 會有初始設定,先按 enter 完成設定,而且會產生package.json 檔案

舉例:mathjs套件使用

$ npm install mathjs // 安裝 JavaScript 的數學套件
$ ls
package.json node_modules package-lock.json // 安裝完後,多了兩個檔案
//開一個新的 js 檔案
var math = require('mathjs') // 引用套件,並將 var 設為 math
console.log(math.sqrt(-4); // 類似 python 引用數據庫,就可以做 負數的開根號

package.json:紀錄套件
node_modules:從這個資料夾引用套件,通常會放在 .gitignore,因為有時使用的套件太多,放在 GitHub 會檔案太大,而且有 package.json 跟 package-lock.json 紀錄,所以當下載專案,執行 npm install,把需要的套件載下來。

3. ESLint

由 ES 和 lint 合成,lint 為語法檢查工具,ES 為 ECMAScript 簡稱,國際認定的標準語言規範,所以 ESLint 就是檢查 JavaScript 語法的工具。

$ npm install  //安裝 
...//安裝中
husky setting up git hooks // 在 git 內,執行 hook,在 commit 之前檢查語法。
... // 安裝完成

//編輯完 js 檔案,想要 commit:
$ git commit -m 'test'
✔ Preparing...  // 語法檢查ing
✔ Hiding unstaged changes to partially staged files...
⚠ Running tasks...

#ESLint #node.js #beginner







Related Posts

安裝MySQL Server

安裝MySQL Server

漏洞與修補留言板 XSS 和 SQL Injection

漏洞與修補留言板 XSS 和 SQL Injection

來幫你的程式寫測試吧!

來幫你的程式寫測試吧!


Comments