构建一个自己的 cli 工具
npm install -g hkt-cli
hkt-cli
hkt-cli -h
init-eslint-js 初始化 JS 项目 eslint
install-eslint-js 安装 JS 项目 eslint 相关依赖
init-prettierrc 初始化项目 prettierrc
init-stylelint 初始化项目 stylelint
init-eslint-ts 初始化 TS 项目 eslint
install-eslint-ts 安装 TS 项目 eslint 相关依赖
init-eslint-react-ts 初始化 typescript react 项目 eslint
install-eslint-react-ts 安装 typescript react 项目的 eslint 相关依赖
init-eslint-react-js 初始化 javascript react 项目 eslint
install-eslint-react-js 安装 javascript react 项目的 eslint 相关依赖
install-stylelint 安装stylelint相关依赖
init-commitlint 初始化项目 commitlint
install-commitlint 安装commitlint相关依赖
会自动在根目录生成
.eslintrc.js
、.eslintignore
和.prettierrc.js
文件
-
eslint for javascript
- 初始化 JS 项目 eslint 规则
hkt-cli init-eslint-js
- 安装 JS 项目 eslint 相关依赖
hkt-cli install-eslint-js
-
eslint for typescript
- 初始化 TS 项目 eslint 规则
hkt-cli init-eslint-ts
- 安装 TS 项目 eslint 相关依赖
hkt-cli install-eslint-ts
-
eslint for React + Typescript
- 初始化 React + TS 项目 eslint 规则
hkt-cli init-eslint-react-ts
- 安装 React + TS 项目 eslint 相关依赖
hkt-cli install-eslint-react-ts
-
eslint for React + javascript
- 初始化 React + JS 项目 eslint 规则
hkt-cli init-eslint-react-js
- 安装 React + JS 项目 eslint 相关依赖
hkt-cli install-eslint-react-js
-
stylelint
- 初始化
stylelint
- 初始化
hkt-cli init-stylelint
- 安装
stylelint
依赖
hkt-cli install-stylelint
- prettier
- 配置
prettier
,配合esllint
使用
- 配置
hkt-cli init-prettier
- commitlint
- 初始化
commitlint
- 初始化
hkt-cli init-commitlint
- 安装
commitlint
依赖, 其中已经包含husky
、lint-staged
在安装
husky
依赖前,请在package.json
的script
中新增"prepare": "husky install"
,这样在安装husky
后会自动启动Git hooks
功能,相当于手动执行npx husky install
。
hkt-cli install-commitlint
- 手动在项目的
package.json
中配置commitlint
的lint-staged
// 具体 lint-staged 要执行什么操作,根据自己的项目而定,下面只是一个实例
"lint-staged": {
"./src/**/*.{js,ts,tsx,jsx}": [
"eslint --fix",
"prettier --write",
"git add"
],
"./src/**/*.{css,less,scss}": [
"stylelint --syntax less --fix",
"git add"
]
}
- 配置
husky
的commitlint
和pre-commit
// 自动生成 .husky/commit-msg,执行 commitlint
npx husky add .husky/commit-msg 'npx --no -- commitlint --edit "$1"'
// 自动生成 .husky/pre-commit 执行 lint-staged
npx husky add .husky/pre-commit "npx lint-staged"
- 可以直接
clone
项目 react-admin
git clone https://github.com/mamba-1024/react-admin-vite.git
cd react-admin-vite
// 安装依赖
npm install
// 本地查看效果
npm run dev