@ebullience/web-project-config
前端项目代码配置文件
npm i -D @ebullience/web-project-config
请使用node16及其以上版本
所有配置只支持原生或react项目
配置eslint
项目根目录下新建配置文件.eslintrc.js:
const config = require('@ebullience/web-project-config').eslint;
module.exports = {
...config,
rules: {
...config.rules,
// 自己的规则
}
}
重启ide或编辑器可完成识别
规则限制了any和require的使用,如果项目中用到了大量any和require,可以设置以下规则忽略:
const rules = {
// 关闭any检测
'@typescript-eslint/no-explicit-any': 'off',
// 关闭require检测
'@typescript-eslint/no-var-requires': 'off'
}
配置stylelint
项目根目录下新建配置文件.stylelintrc.js:
const config = require('@ebullience/web-project-config').stylelint;
module.exports = {
...config,
rules: {
...config.rules,
// 自己的规则
}
}
重启ide或编辑器可完成识别
配置prettier
项目根目录下新建配置文件.prettierrc.js:
const config = require('@ebullience/web-project-config').prettier;
module.exports = {
...config,
// 自己的规则
}
重启ide或编辑器可完成识别
规则强制使用单引号和句尾分号,如果项目中有大量双引号或者不带句尾分号,可以设置以下规则忽略:
const rules = {
// 使用双引号
singleQuote: false,
// jsx中使用双引号
jsxSingleQuote: false,
// 不使用句尾分号
semi: false
}
配置typescript
目前一共有两个ts配置文件:
1. typescript-web/tsconfig.json
用于编写直接在浏览器中执行的代码,编译后只会去掉类型说明,保留最新es特性。该配置不兼容node特性比如node_modules。
项目根目录下新建配置文件tsconfig.json:
{
"extends": "@ebullience/web-project-config/typescript-web/tsconfig.json"
}
2. typescript-node/tsconfig.json
用于编写前端库,编译后会去掉类型说明,并去除最新es特性。编译后的代码会在node中交给前端打包器进一步处理。
项目根目录下新建配置文件tsconfig.json:
{
"extends": "@ebullience/web-project-config/typescript-node/tsconfig.json"
}
如果项目没有浏览器兼容性要求web环境可以使用最新es特性,可以配置target选项在ts编译时不转化es特性只去掉类型说明
{
"extends": "@ebullience/web-project-config/typescript-node/tsconfig.json",
"compilerOptions": {
"target": "esnext"
}
}
如果项目库中包含js,需要编译js文件,可以配置允许编译js文件选项
{
"extends": "@ebullience/web-project-config/typescript-node/tsconfig.json",
"compilerOptions": {
"allowJs": true
}
}
重启ide或编辑器可完成识别