vscode React插件

 

ESLint

代碼語法檢測,自帶代碼檢測無法很好的識別ES6,使用ESlint做代碼檢測之后,需要屏蔽VSCode自帶 "javascript.validate.enable": false（此處保留）

 

================

1 prettier 代碼格式化的使用說明---------------------------------
vscode安裝prettier擴展，安裝完成后對vsCode進行如下設置：
1、"editor.formatOnSave": true
2、"editor.defaultFormatter": "esbenp.prettier-vscode",
"[javascript]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},3、
"[css]": {
"editor.defaultFormatter": "esbenp.prettier-vscode"
},
2 import含有@符號的路徑代碼提示，vscode安裝Path Intellisense擴展，並進行如下設置-------------------
"path-intellisense.mappings": {
"@": "${workspaceRoot}/src"
}

3 注釋的使用規范-----------------------------------
組件內部的方法必須有完整的注釋，將方法及參數進行詳細說明

4 koroFileheader 文檔頭部注釋 vscode安裝koroFileheader擴展並進行如下設置 ------------------------------
"fileheader.customMade": {
"Autor": "devfpy",
"Date": "Do not edit",
"LastEditTime": "Do not edit",
"Description": ""
},

5 props聲明、props默認值、props使用注意事項---------------------------
import PropTypes from 'prop-types';
static propTypes = {
dataSetData: PropTypes.any,
chartsOptionOnChange: PropTypes.func
};

static defaultProps = {
dataSetData: []
};

6 console的使用方式及注意事項，模塊開發完成后一定要刪除所有的console.log------------------
console.log
console.warn
console.table

7 ESLint 代碼檢查-----------------
安裝依賴
npm install -D prettier
npm install -D eslint-config-prettier
npm install -D eslint-plugin-prettier

修改config-overrides.js
刪除或注釋disableEsLint()