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()