小記:eslint開發,從入門到還好我沒放棄!

第一步,你得有個自己的文件夾-----  一定要以‘eslint-config-* 爲前綴

比如 我的就是  ‘eslint-config-test’

第二步,創建個測試文件  test.js

function te() {
    var a = [1,2,3,4,5]
    var sum = 0
    for(var i = 0; i < a.length;i++){
        sum += a[i];
    }
    return sum;
}
console.log(te())

運行通過後,一定要記得查看你是否配置了eslint

如果沒有的話,就要全局安裝了哦   npm install -g eslint

利用已經安裝的eslint檢查上邊的測試代碼是否有問題   eslint test.js

沒報錯的話就說明你通過了哦。。

第三步,創建  .eslintrc.js  

module.exports = {
    extends: 'eslint:recommended',
};

再試一試 eslint test.js

哎呦,,報錯了哦

  • Unexpected console statement no-console - 不能使用console
  • ‘console’ is not defined no-undef - console變量未定義,不能使用未定義的變量

根據報錯,將 .eslintrc.js 中的內容改爲

module.exports = {
    extends: 'eslint:recommended',
    env: {
        node: true,
    },
    rules: {
        'no-console': 'off',
    },
};

再運行 eslint test.js ,不報錯吧!

第四步,創建 package.json

{
  "name": "eslint-config-test",
  "version": "1.0.0",
  "eslintConfig": {
    "extends": "eslint:recommended",
    "env": {
      "node": true
    },
    "rules": {
      "no-console": "off"
    }
  }
}

現在只是在eslint:recommended基礎上添加了規則 "no-console": "off"

第五步,如何做到共享配置文件

創建  public-eslintrc.js

module.exports = {
  extends: 'eslint:recommended',
  env: {
    node: true,
  },
  rules: {
    'no-console': 'off',
    'indent': [ 'error', 2 ],
    'quotes': [ 'error', 'single' ],
  },
};

修改 .eslintrc.js 

module.exports = {
  extends: './public-eslintrc.js',
};

執行eslint 檢查

這就說明公共配置文件已經生效了!

eslint test.js --fix   就可以修復報錯!

這樣就可以將一些自定義的規則放入public-eslintrc.js中了,當然你也可以創建很多個配置文件!

第六步,發佈自己的配置

在這裏我將public-eslintrc.js 改爲了index.js了

修改package.json裏的內容

{
  "name": "eslint-config-test",
  "version": "1.0.0",
  "main": "index.js"
}

爲了能讓eslint正確載入這個模塊,我們需要執行npm link將這個模塊鏈接到本地全局位置    npm link eslint-config-test

如果失敗了,可以試試 sudo npm link eslint-config-test

將.eslintrc.js修改爲

module.exports = {
    extends: 'test',
};

 在extends中eslint-config-test可以簡寫爲test

 最後就可以npm publish 打包了 ,讓其他人可以通過  npm install -g eslint-config-test 使用你配置的文件啦!

在這最後一步我遇到一個問題,就是需要設置倉庫地址  npm config set registry https://registry.npmjs.org/

之後需要在npm中註冊自己的姓名及郵箱  npm login

最後執行  npm publish

可參考:https://morning.work/page/maintainable-nodejs/getting-started-with-eslint.html 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章