配置eslint規(guī)范項(xiàng)目代碼風(fēng)格
為什么要使用eslint
你在接手一個(gè)項(xiàng)目的維護(hù)迭代任務(wù),閱讀代碼的時(shí)候是否會(huì)因?yàn)轫?xiàng)目中充斥著各種風(fēng)格的代碼而感到頭疼?沒錯(cuò),eslint就是為了解決這類問題
eslint能做什么?
1.代碼風(fēng)格錯(cuò)誤提示
配置好eslint后,如果代碼風(fēng)格與配置描述的不符,eslint會(huì)提示代碼中存在的風(fēng)格問題;一般提示的情形有:
1.編輯器內(nèi),大多數(shù)編輯器配置好后能讀取eslint配置文件并在文件中進(jìn)行相應(yīng)提示
2.eslint-loader配合webpack-dev-server能在頁面中彈出相應(yīng)錯(cuò)誤內(nèi)容
3.eslint通過命令號(hào)對代碼進(jìn)行風(fēng)格檢查
2.修復(fù)相應(yīng)風(fēng)格問題
eslint --fix 命令能修復(fù)一部分代碼風(fēng)格問題;能修復(fù)的范圍見https://cn.eslint.org/docs/rules/中帶工具圖標(biāo)的部分
常見問題
如何在局部禁用eslint
/* eslint-disable no-alert, no-console */ alert('foo'); console.log('bar'); /* eslint-enable no-alert, no-console */
以下是詳細(xì)配置
{ root: true,// 直接在根目錄讀取配置文件,能提高eslint性能 "env": { "node": true,// 允許使用nodejs相關(guān)的變量,下同 "es6": true, "browser": true, "commonjs": true }, "extends": "standard", // 繼承eslint-config-standard中的配置,可以在rules中覆蓋 "parser": "babel-eslint", // 為eslint制定parser,默認(rèn)的Esprima只允許已納入es標(biāo)準(zhǔn)的內(nèi)容 "plugins": "vue",// 使用eslint-plugin-vue,使eslint能對vue語法進(jìn)行處理,相應(yīng)rules見https://eslint.vuejs.org/rules/ "rules": { "no-alert": 2, "indent": ["error", 4, { "SwitchCase": 1, "VariableDeclarator": 1, "outerIIFEBody": 1, "MemberExpression": 1, "FunctionDeclaration": { "parameters": 1, "body": 1 }, "FunctionExpression": { "parameters": 1, "body": 1 }, "CallExpression": { "arguments": 1 }, "ArrayExpression": 1, "ObjectExpression": 1, "ImportDeclaration": 1, "flatTernaryExpressions": false, "ignoreComments": false }] } }
以上就是本文的全部內(nèi)容,希望對大家的學(xué)習(xí)有所幫助,也希望大家多多支持腳本之家。
- 快速設(shè)置IDEA代碼風(fēng)格為Google風(fēng)格
- eslint+prettier統(tǒng)一代碼風(fēng)格的實(shí)現(xiàn)方法
- 實(shí)例詳解Vue項(xiàng)目使用eslint + prettier規(guī)范代碼風(fēng)格
- 如何使用 Pylint 來規(guī)范 Python 代碼風(fēng)格(來自IBM)
- Pycharm學(xué)習(xí)教程(2) 代碼風(fēng)格
- php好代碼風(fēng)格的階段性總結(jié)
- .Net 項(xiàng)目代碼風(fēng)格要求小結(jié)
- 當(dāng)前流行的JavaScript代碼風(fēng)格指南
- 你應(yīng)該知道的Ruby代碼風(fēng)格
- 關(guān)于更改Zend Studio/Eclipse代碼風(fēng)格主題的介紹
- JQuery入門—JQuery程序的代碼風(fēng)格詳細(xì)介紹
- Java黑科技之通過Google Java Style 文件配置IDEA和Ecplise代碼風(fēng)格
相關(guān)文章
js實(shí)現(xiàn)textarea限制輸入字?jǐn)?shù)
本文主要介紹了js實(shí)現(xiàn)textarea限制輸入字?jǐn)?shù)的原理與方法。具有很好的參考價(jià)值,下面跟著小編一起來看下吧2017-02-02Javascript控制input輸入時(shí)間格式的方法
這篇文章主要介紹了Javascript控制input輸入時(shí)間格式的方法,涉及鼠標(biāo)事件及正則表達(dá)式的靈活應(yīng)用,需要的朋友可以參考下2015-01-01微信小程序?qū)崿F(xiàn)的日期午別醫(yī)生排班表功能示例
這篇文章主要介紹了微信小程序?qū)崿F(xiàn)的日期午別醫(yī)生排班表功能,結(jié)合實(shí)例形式分析了微信小程序?qū)崿F(xiàn)基于日期時(shí)間、針對上午、下午、凌晨、夜間等時(shí)段的排班功能相關(guān)操作技巧,需要的朋友可以參考下2019-01-01利用JS實(shí)現(xiàn)scroll自定義滾動(dòng)效果詳解
這篇文章主要給大家介紹了關(guān)于利用JS如何實(shí)現(xiàn)scroll自定義滾動(dòng)效果的相關(guān)資料,文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧。2017-10-10JavaScript實(shí)現(xiàn)將數(shù)組數(shù)據(jù)添加到Select下拉框的方法
這篇文章主要介紹了JavaScript實(shí)現(xiàn)將數(shù)組數(shù)據(jù)添加到Select下拉框的方法,涉及javascript數(shù)組操作及頁面元素動(dòng)態(tài)賦值的相關(guān)技巧,需要的朋友可以參考下2015-08-08JavaScript(js)設(shè)置默認(rèn)輸入焦點(diǎn)(focus)
常常會(huì)在回復(fù)和引用里使用此功能,即單擊回復(fù)或引用,如讓輸入焦點(diǎn)出現(xiàn)在留言輸入框中,如果使用錨來定位,輸入焦點(diǎn)就不能激活了,需要了解的朋友可以參考下2012-12-12仿iPhone通訊錄制作小程序自定義選擇組件的實(shí)現(xiàn)
這篇文章主要介紹了仿iPhone通訊錄制作小程序自定義選擇組件的實(shí)現(xiàn),文中通過示例代碼介紹的非常詳細(xì),對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2019-05-05