規範化標準

一、

爲何要有規範化標準

軟件開發須要多人協同

不一樣開發有不一樣習慣和喜愛

不一樣喜愛增長項目維護成本

因此須要統一標準

哪裏須要

代碼、文檔、日誌

人爲編寫的都須要

代碼標準化規範

實施規範化的方法

編碼前人爲的標準約定

經過工具實現Lint

二、ESLint介紹

最爲主流的js lint檢測工具

很容易統一開發者的編碼風格

能夠幫助提高編碼能力

三、EsLint安裝

npm install eslint --save-dev

四、快速上手

檢查步驟

編寫問題代碼

使用eslint執行

以前完成eslint配置

npm eslint init

npm eslint 對應地址

module.exports = {
  env: {
    browser: true,
    es2020: true
  },
  extends: [
    'standard'
  ],
  parserOptions: {
    ecmaVersion: 11
  },
  rules: {
  }
}

eslint配置文件

module.exports = {

 env: {
   browser: false,
   es6: false
 },
 extends: [
  'standard'
 ],
 parserOptions: { 
   ecmaVersion: 2015 //檢測語法，可是不檢測變量是否可用，配置須要env來配置
 },
 rules: {
   'no-alert': "error"
 },
 globals: {
   "jQuery": "readonly"
 }
}

eslint配置註釋

const str1 = "${name} is a coder" // eslint-disable-line no-template-curly-in-string

結合自動化工具

與項目統一，管理更加方便

eslint結合webpack後續配置

extends: [
  ‘standard’，
  ‘plugin：react/recommended’
],

檢查typescript


parser: '@typescript-eslint/parser’,//配置語法解析器

parserOptions: {

ecmaVersion: 11

},
plugins: [

'@typescript-eslint'
],

eslint結合git hooks

pre-commit文件進行修改

husky能夠實現git hooks的使用需求

'husky':{
   hook:{
   precommit:'npm run test'
   }
}