mirror of
https://gitee.com/vant-contrib/vant.git
synced 2025-04-06 03:57:59 +08:00
88 lines
1.9 KiB
Markdown
88 lines
1.9 KiB
Markdown
# Vant Cli
|
||
|
||
Vant Cli 是一个 Vue 组件库构建工具，通过 Vant Cli 可以快速搭建一套功能完备的 Vue 组件库。
|
||
|
||
### 特性
|
||
|
||
- 提供丰富的命令，涵盖从开发测试到构建发布的完整流程
|
||
- 基于约定的目录结构，自动生成优雅的文档站点和组件示例
|
||
- 内置 ESlint、Stylelint 校验规则，提交代码时自动执行校验
|
||
- 构建后的组件库默认支持按需引入、主题定制、Tree Shaking
|
||
|
||
### 安装
|
||
|
||
```shell
|
||
# 通过 npm 安装
|
||
npm i @vant/cli -D
|
||
|
||
# 通过 yarn 安装
|
||
yarn add @vant/cli --dev
|
||
```
|
||
|
||
安装完成后，请将以下配置添加到 package.json 文件中
|
||
|
||
```json
|
||
{
|
||
"scripts": {
|
||
"dev": "vant-cli dev",
|
||
"test": "vant-cli test",
|
||
"lint": "vant-cli lint",
|
||
"release": "vant-cli release",
|
||
"build-site": "vant-cli build-site"
|
||
},
|
||
"husky": {
|
||
"hooks": {
|
||
"pre-commit": "lint-staged",
|
||
"commit-msg": "vant commit-lint"
|
||
}
|
||
},
|
||
"lint-staged": {
|
||
"*.{ts,tsx,js,jsx,vue}": [
|
||
"eslint",
|
||
"git add"
|
||
],
|
||
"*.{vue,css,less,scss}": [
|
||
"stylelint",
|
||
"git add"
|
||
]
|
||
},
|
||
"eslintConfig": {
|
||
"root": true,
|
||
"extends": ["@vant"]
|
||
},
|
||
"stylelint": {
|
||
"extends": ["@vant/stylelint-config"]
|
||
},
|
||
"prettier": {
|
||
"singleQuote": true
|
||
},
|
||
"browserslist": ["Android >= 4.0", "iOS >= 8"]
|
||
}
|
||
```
|
||
|
||
## 命令
|
||
|
||
### dev
|
||
|
||
本地开发，dev 命令会启动一个本地服务器，用于在开发过程中对文档和示例进行预览
|
||
|
||
### build
|
||
|
||
构建组件库，在`es`和`lib`目录生成可用于生产环境的组件代码
|
||
|
||
### build-site
|
||
|
||
构建文档站点，在`site`目录生成可用于生产环境的文档站点代码
|
||
|
||
### release
|
||
|
||
发布组件库，发布前会自动执行 build 命令
|
||
|
||
### changelog
|
||
|
||
基于 Github 的 Pull Request 生成更新日志，仅对 Github 仓库有效
|
||
|
||
### commit-lint
|
||
|
||
校验 commit message 的格式是否符合规范，需要配合`husky`在提交 commit 时触发
|