lyh0371 / web-norm

简化前端项目规范构建（希望它不是个玩具）

web-norm

新坑推广🔥🔥

vv-react-table(虚拟列表解决方案) 欢迎使用😚

初衷

每当接手一个新项目（如果项目中没有配置 eslint husky commitlint）等这些规范的话，就需要自己手动配置一遍，配置多了后我只能来句窝草！😬

目标

一个命令自动化配置项目规范

你将得到

• 保存代码自动格式化💯
• 提交前 commit 校验💯
• eslint + pretter 校验💯
• husky 自动装载💯
• 说吧，你还想要啥...

安装

1 局部安装（推荐使用）

npm install web-norm -D | yarn add web-norm -D | pnpm install web-norm -D

在 package.json 中

 "scripts": {
    "web-norm": "web-norm",
  },

2. 全局安装

npm install web-norm -g | yarn add web-norm -g | pnpm install web-norm -g

使用

运行命令

请确保您的项目使用了git，否则会导致`husky`不生效

npm run web-norm

支持配置

web-norm 默认在提交记录上为带表情符号 📦👷📝🌟🐛🚀🌠🔂💎🚨 。如果不喜欢这些表情符号的话可以在用 web-norm 初始化项目的时候加上 --noEmoji 去掉

 "scripts": {
    "web-norm": "web-norm --noEmoji",
  },

验证

代码提交前校验

npm run commit

在老项目中使用

在老项目使用会牵扯到一个问题就是以前的代码规范和通过web-norm生成的代码规范不一致怎么办？

1、如果项目比较小，只有几个文件，你可以把所以的文件都保存一遍即可（保存的时候 vscode 会自动格式化代码，确保使用 vscode 编辑器并安装 eslint 和 pretter 插件）

2、如果项目比较大，建议使用 vscode 插件Format Files进行自动化保存

可能遇到问题，详细内容参考这篇文章可能遇到问题

• husky 无法触发

1. 项目首先需要被 git 管理

2. mac 电脑执行 npm run postinstallmac 来设置 husky 的读写权限

说明

1. web-norm 只支持 vue（包括 vue3）及 react 项目

2. 在使用过程中遇到任何问题，请提交 issues 😚

web-norm's Issues

提交报错乱码了

window
vue3
git提交的时候，报错乱码了

pnpm i 报错 Unmet peer dependencies

• 系统：windows 10
• node：v16.17.0
• 项目使用pnpm web-norm 之前依赖：
  

使用命令后，pnpm i 出现错误

项目结构出现了mac独有的`.DS_Store`

你好，对这个项目比较感兴趣。
在fork之后，看了下好像是没有配置.gitignore，导致文件中有一些.DS_Store和yarn-error这类的冗余文件也在项目中。

于是提交了个PR #8 ，配置了一下文件。

提交代码 如何 忽略文件 或者 文件夹，目前拦截产生了警告

warning File ignored because of a matching ignore pattern. Use "--no-ignore" to override
只是忽略一个文件目录，就产生了 上面的警告 导致文件无法上传

不太好用啊

试了一下不太好用啊，没有自动化格式校验不说，基本的模板工程也没

执行npm run commit 的时候报错

自定义配置以及右键配置

感觉这个可以帮助新项目省很多力气
作者有想过将这个弄到老项目的场景嘛？比如支持自定义是保存时格式化，还是右键点击格式化
或者提示报错的信息，是否支持自定义与默认合并组成最终的验证格式化规则

lint-stage 写法

发现生成的 lint-stage 为：

{
"lint-staged": {
    "*.{js,ts,vue,jsx,tsx}": ['npm run eslint'],
    "*.{js,jsx,ts,tsx,md,html,css,lees,scss,sass}": 'prettier --write',
  }
}

是不是应该是这样？

{
"lint-staged": {
    "*.{js,ts,vue,jsx,tsx}": ["npm run eslint","prettier --write"],
    "*.{md,html,css,lees,scss,sass}": "prettier --write",
  }
}

之前我和上面的配置方式一样，但是好像 commit 的时候 eslint 没有生效，后来改成后面这样的就好了。环境是mac+vscode

husky 在mac中不生效

husky 在mac中不生效

运行npm run commit 会报错

怀疑是这个文件的报错，应该怎么修改呢

package.json中没有eslint相关依赖写入

提Issues标准

1. 明确说明自己代码运行环境 IOS | window 框架是vue（2|3） 还是react
2. 如有报错，提供报错截图

少安装了一个依赖

win11，Vue3-ts
执行web-norm命令之后，pnpm Install，会报缺少一个依赖，
Peer dependencies that should be installed:
inquirer@^8.0.0
如果安装的时候，不指定它的版本，就会下载到9以上的版本，然而9版本在commit的时候会有问题，安装回8版本之后没问题。

react eslint 配置支持

eslint的双引错误，好像会在jsx中生效，导致一大片的报错

是不是不支持Nuxt3？

如题（插件很好用辛苦了）