@varlet/cli 2.7.0 → 2.7.2

package/README.md

@@ -1,65 +1,67 @@
-# @varlet/cli
+# Components Library Tools(@varlet/cli)
 
-开箱即用的 `Vue3组件库` 快速成型工具，提供了一系列命令和工具去解决组件库开发上的问题
+### Intro
 
-### 特性
-- 📦  开箱即用的组件库开发环境
-- 📦  开箱即用的组件库编译工具，支持导出 `esm`, `cjs`, `umd` 三种模块代码
-- 🛠️  基于配置文件的组件库文档站点，支持百度统计和主题定制
-- 🛠️  支持 `sfc` 和 `tsx` 两种风格的组件库编写风格
-- 📦  开箱即用的代码检查工具
-- 📦  开箱即用的单元测试工具
-- 📦  开箱即用的代码发布工具,同时发布到 `npm` 和 `github`, 并自动生成更新日志
-- 💪  支持 `Typescript`
-- 💪  支持 `暗黑模式`
-- 🌍  支持 `国际化`
-- 🚀  基于 `pnpm`
+The out-of-the-box `Vue3 component library` rapid prototyping tool provides a series of commands and tools to solve the problem of component library development.
 
-### 快速开始
+### Features
 
-`@varlet/cli` 内置了 `sfc` 和 `tsx` 两种风格的组件库项目模板，可以通过 `gen` 命令直接生成。
-方便您直接进入组件库开发。
+- 📦  Out-of-the-box component library development environment
+- 📦  An out-of-the-box component library compilation tool that supports exporting `esm`, `cjs`, `umd` module codes
+- 🛠️  Configuration file-based component library documentation site, support Baidu statistics and theme customization
+- 🛠️  Supports both `sfc` and `tsx` styles for writing component libraries
+- 📦  Out-of-the-box code inspection tool
+- 📦  Out-of-the-box unit testing tools
+- 📦  Out-of-the-box code publishing tool, publishes to both `npm` and `github`, and automatically generates changelogs
+- 💪  Support for `Typescript`
+- 💪  Support `Dark Mode`
+- 🌍  Support `Internationalization`
+- 🚀  Based on `pnpm`
+
+### Quickstart
+
+`@varlet/cli` has built-in `sfc` and `tsx` style component library project templates, which can be generated directly by the `gen` command.
+It is convenient for you to directly enter the component library development.
 
 ```shell
-# 安装命令行工具
+# playground-ignore
 pnpm add @varlet/cli -g
 varlet-cli gen
 ```
 
-然后通过简单修改一些组件库模板的基础信息，就可以开始组件库的开发了
-
-## 高级定制
-
-### 配置文件
-
-项目根目录下的 `varlet.config.mjs` 用来管理整个组件库项目的具体细节。
-默认配置可查阅 [varlet.default.config.ts](https://github.com/varletjs/varlet/blob/dev/packages/varlet-cli/src/node/config/varlet.default.config.ts)。
-也可以参考 `@varlet/ui` 的 [varlet.config.mjs](https://github.com/varletjs/varlet/blob/dev/packages/varlet-ui/varlet.config.mjs)
-
-| 参数 | 说明 | 类型 | 默认值 |
-| ----- | -------------- | -------- | ---------- |
-| `name` | 组件库全名，会作为包名 | _string_ | `Varlet` |
-| `namespace` | 组件库命名空间, 会作为组件前缀 | _string_ | `var` |
-| `host` | 开发服务器主机 | _string_ | `localhost` |
-| `port` | 开发服务器端口 | _number_ | `8080` |
-| `title` | 文档中组件库的标题 | _string_ | `VARLET` |
-| `logo` | 文档中组件库的logo | _string_ | `-` |
-| `defaultLanguage` | 文档默认语言 | _string_ | `zh-CN` |
-| `useMobile` | 是否显示右侧手机预览 | _boolean_ | `false` |
-| `lightTheme` | 亮色模式文档主题 | _Record<string, any>_ | `-` |
-| `darkTheme` | 暗黑模式文档主题 | _Record<string, any>_ | `-` |
-| `highlight` | 文档代码片段样式相关 | _{ style: string }_ | `-` |
-| `analysis` | 文档统计相关 | _{ baidu: string }_ | `-` |
-| `pc` | pc端文档结构配置 | _Record<string, any>_ | `-` |
-| `mobile` | mobile端文档结构配置 | _Record<string, any>_ | `-` |
-| `moduleCompatible` | 模块兼容配置 | _Record<string, string>_ | `-` |
-
-### 自定义页面
-
-如果想在组件库中插入其他页面，可以在项目根目录下的创建 `pages` 文件夹编写 vue 组件， 用来生成其他的页面。
-目录结构如下：
+## Advanced customization
+
+### Configuration file
+
+The `varlet.config.mjs` in the project root directory is used to manage the specific details of the entire component library project.
+The default configuration can be viewed [varlet.default.config.ts](https://github.com/varletjs/varlet/blob/dev/packages/varlet-cli/src/node/config/varlet.default.config.ts).
+Also refer to `@varlet/ui` [varlet.config.mjs](https://github.com/varletjs/varlet/blob/dev/packages/varlet-ui/varlet.config.mjs).
+
+| Parameter | Description | Type | Default |
+| -- | -------------- | -------- | ---------- |
+| `name` | The full name of the component library, which will be used as the package name | _string_ | `Varlet` |
+| `namespace` | Component library namespace, which will be used as a component prefix | _string_ | `var` |
+| `host` | Development server host | _number_ | `localhost` |
+| `port` | Development server port | _number_ | `8080` |
+| `title` | The title of the component library in the documentation | _string_ | `VARLET` |
+| `logo` | The logo of the component library in the documentation | _string_ | `-` |
+| `defaultLanguage` | Documentation default language | _string_ | `zh-CN` |
+| `useMobile` | Whether to show the preview of the right mobile phone | _boolean_ | `false` |
+| `lightTheme` | Light Mode Documentation Theme | _Record<string, any>_ | `-` |
+| `darkTheme` | Dark Mode Documentation Theme | _Record<string, any>_ | `-` |
+| `highlight` | Documentation snippet style related | _{ style: string }_ | `-` |
+| `analysis` | Document statistics related | _{ baidu: string }_ | `-` |
+| `pc` | PC-side document structure configuration | _Record<string, any>_ | `-` |
+| `mobile` | Mobile side document structure configuration | _Record<string, any>_ | `-` |
+| `copy` | Copy file options | _{ from: string, to: string, type: 'folder' | 'file' }[]_ | `-` |
+
+### Custom pages
+
+If you want to insert other pages into the component library, you can create a `pages` folder in the project root directory to write a vue component to generate other pages.
+The directory structure is as follows:
 
 ```text
+// playground-ignore
 |-- varlet-ui
   |-- src
   |-- docs
@@ -75,122 +77,136 @@ varlet-cli gen
         |-- zh-CN.ts
         |-- en-US.ts
       |-- index.vue
+      
 ```
 
-生成的路由如下：
+The resulting route is as follows:
 
 ```text
+// playground-ignore
 /zh-CN/sponsor
 /en-US/contributor
 /zh-CN/changelog
 /en-US/changelog
 ```
 
-### 命令相关
+### Command related
 
-#### 启动开发服务器
+#### Start the development server
 
 ```shell
+# playground-ignore
 varlet-cli dev
 ```
 
-#### 构建文档站点
+#### Build a documentation site
 
 ```shell
+# playground-ignore
 varlet-cli build
 ```
 
-#### 预览文档站点
+#### Preview documentation site
 
 ```shell
+# playground-ignore
 varlet-cli preview
 ```
 
-#### 构建组件库代码
+#### Compile component library
 
 ```shell
+# playground-ignore
 varlet-cli compile
 ```
 
-#### 执行所有的单元测试
+#### Execute all unit tests
 
 ```shell
+# playground-ignore
 varlet-cli test
 ```
 
-#### 以 watch 模式执行单元测试
+#### Execute unit tests in watch mode
 
 ```shell
+# playground-ignore
 varlet-cli test -w
 or
 varlet-cli test -wa
 ```
 
-#### 检查代码
+#### Lint the code
 
 ```shell
+# playground-ignore
 varlet-cli lint
 ```
 
-#### 校验提交信息
+#### Lint git commit message
 
 ```shell
+# playground-ignore
 varlet-cli commit-lint
 ```
 
-#### 生成更新日志
+#### Generate changelog
 
 ```shell
+# playground-ignore
 varlet-cli changelog
 ```
 
-#### 发布组件库
+#### Release component library
 
 ```shell
+# playground-ignore
 varlet-cli release
 ```
 
-#### 生成一个项目模板
+#### Generate a project template
 
 ```shell
+# playground-ignore
 varlet-cli gen
 
 # Options
 -n
 --name
-  项目名
+  project name
 -s
 --sfc
-  生成 sfc 风格的项目模板
+  Generate sfc-style project templates
 -t
 --tsx
-  生成 tsx 格式项目
+  Generate tsx-style project templates
 -l
 --locale
-  需要支持国际化
+  Need to support internationalization
 ```
 
-#### 创建组件模板文件
+#### Create a component template file
 
 ```shell
+# playground-ignore
 varlet-cli create
 
 # Options
 -n
 --name
-  组件名
+  project name
 -s
 --sfc
-  生成 sfc 风格的组件
+  Generate sfc-style component
 -t
 --tsx
-  生成 tsx 风格的文件
+  Generate tsx-style component
 -l
 --locale
-  需要支持国际化
+  Need to support internationalization
 ```
 
-### 发布前注意
+### Note before publish
 
-1. `npm` 的仓库源必须指向 `npm` 官方镜像
-2. 执行 `npm login` 进行登录
+- 1.`npm` repository registry must set to `npm` official mirror
+- 2.Execute `npm login` to log in

package/README.zh-CN.md

@@ -0,0 +1,211 @@
+# 组件库快速成型工具(@varlet/cli)
+
+### 介绍
+
+开箱即用的 `Vue3组件库` 快速成型工具，提供了一系列命令和工具去解决组件库开发上的问题。
+
+### 特性
+
+- 📦  开箱即用的组件库开发环境
+- 📦  开箱即用的组件库编译工具，支持导出 `esm`, `cjs`, `umd` 三种模块代码
+- 🛠️  基于配置文件的组件库文档站点，支持百度统计和主题定制
+- 🛠️  支持 `sfc` 和 `tsx` 两种风格的组件库编写风格
+- 📦  开箱即用的代码检查工具
+- 📦  开箱即用的单元测试工具
+- 📦  开箱即用的代码发布工具,同时发布到 `npm` 和 `github`, 并自动生成更新日志
+- 💪  支持 `Typescript`
+- 💪  支持 `暗黑模式`
+- 🌍  支持 `国际化`
+- 🚀  基于 `pnpm`
+
+### 快速开始
+
+`@varlet/cli` 内置了 `sfc` 和 `tsx` 两种风格的组件库项目模板，可以通过 `gen` 命令直接生成。
+方便您直接进入组件库开发。
+
+```shell
+# playground-ignore
+pnpm add @varlet/cli -g
+varlet-cli gen
+```
+
+## 高级定制
+
+### 配置文件
+
+项目根目录下的 `varlet.config.mjs` 用来管理整个组件库项目的具体细节。
+默认配置可查阅 [varlet.default.config.ts](https://github.com/varletjs/varlet/blob/dev/packages/varlet-cli/src/node/config/varlet.default.config.ts)。
+也可以参考 `@varlet/ui` 的 [varlet.config.mjs](https://github.com/varletjs/varlet/blob/dev/packages/varlet-ui/varlet.config.mjs)。
+
+| 参数 | 说明 | 类型 | 默认值 |
+| -- | -------------- | -------- | ---------- |
+| `name` | 组件库全名，会作为包名 | _string_ | `Varlet` |
+| `namespace` | 组件库命名空间, 会作为组件前缀 | _string_ | `var` |
+| `host` | 开发服务器主机 | _number_ | `localhost` |
+| `port` | 开发服务器端口 | _number_ | `8080` |
+| `title` | 文档中组件库的标题 | _string_ | `VARLET` |
+| `logo` | 文档中组件库的logo | _string_ | `-` |
+| `defaultLanguage` | 文档默认语言 | _string_ | `zh-CN` |
+| `useMobile` | 是否显示右侧手机预览 | _boolean_ | `false` |
+| `lightTheme` | 亮色模式文档主题 | _Record<string, any>_ | `-` |
+| `darkTheme` | 暗黑模式文档主题 | _Record<string, any>_ | `-` |
+| `highlight` | 文档代码片段样式相关 | _{ style: string }_ | `-` |
+| `analysis` | 文档统计相关 | _{ baidu: string }_ | `-` |
+| `pc` | pc 端文档结构配置 | _Record<string, any>_ | `-` |
+| `mobile` | mobile 端文档结构配置 | _Record<string, any>_ | `-` |
+| `copy` | 复制文件配置 | _{ from: string, to: string, type: 'folder' | 'file' }[]_ | `-` |
+
+### 自定义页面
+
+如果想在组件库中插入其他页面，可以在项目根目录下的创建 `pages` 文件夹编写 vue 组件， 用来生成其他的页面。
+目录结构如下：
+
+```text
+// playground-ignore
+|-- varlet-ui
+  |-- src
+  |-- docs
+  |-- pages
+    |-- sponsor
+      |-- index.vue
+    |-- contributor
+      |-- locale
+        |-- en-US.ts
+      |-- index.vue
+    |-- changelog
+      |-- locale
+        |-- zh-CN.ts
+        |-- en-US.ts
+      |-- index.vue
+```
+
+生成的路由如下：
+
+```text
+// playground-ignore
+/zh-CN/sponsor
+/en-US/contributor
+/zh-CN/changelog
+/en-US/changelog
+```
+
+### 命令相关
+
+#### 启动开发服务器
+
+```shell
+# playground-ignore
+varlet-cli dev
+```
+
+#### 构建文档站点
+
+```shell
+# playground-ignore
+varlet-cli build
+```
+
+#### 预览文档站点
+
+```shell
+# playground-ignore
+varlet-cli preview
+```
+
+#### 构建组件库
+
+```shell
+# playground-ignore
+varlet-cli compile
+```
+
+#### 执行所有的单元测试
+
+```shell
+# playground-ignore
+varlet-cli test
+```
+
+#### 以 watch 模式执行单元测试
+
+```shell
+# playground-ignore
+varlet-cli test -w
+or
+varlet-cli test -wa
+```
+
+#### 检查代码
+
+```shell
+# playground-ignore
+varlet-cli lint
+```
+
+#### 校验提交信息
+
+```shell
+# playground-ignore
+varlet-cli commit-lint
+```
+
+#### 生成更新日志
+
+```shell
+# playground-ignore
+varlet-cli changelog
+```
+
+#### 发布组件库
+
+```shell
+# playground-ignore
+varlet-cli release
+```
+
+#### 生成一个项目模板
+
+```shell
+# playground-ignore
+varlet-cli gen
+
+# Options
+-n
+--name
+  项目名
+-s
+--sfc
+  生成 sfc 风格的项目模板
+-t
+--tsx
+  生成 tsx 格式项目
+-l
+--locale
+  需要支持国际化
+```
+
+#### 创建组件模板文件
+
+```shell
+# playground-ignore
+varlet-cli create
+
+# Options
+-n
+--name
+  组件名
+-s
+--sfc
+  生成 sfc 风格的组件
+-t
+--tsx
+  生成 tsx 风格的文件
+-l
+--locale
+  需要支持国际化
+```
+
+### 发布前注意
+
+- 1.`npm` 的仓库源必须指向 `npm` 官方镜像
+- 2.执行 `npm login` 进行登录

package/lib/node/compiler/compileSFC.js

@@ -3,7 +3,7 @@ import hash from 'hash-sum';
 import { parse, resolve } from 'path';
 import { parse as parseSFC, compileTemplate, compileStyle } from '@vue/compiler-sfc';
 import { replaceExt, smartAppendFileSync } from '../shared/fsUtils.js';
-import { compileScript } from './compileScript.js';
+import { compileScript, getScriptExtname } from './compileScript.js';
 import { clearEmptyLine, compileLess, extractStyleDependencies, normalizeStyleDependency, STYLE_IMPORT_RE, } from './compileStyle.js';
 import logger from '../shared/logger.js';
 const { readFile, writeFileSync } = fse;
@@ -59,7 +59,7 @@ export async function compileSFC(sfc) {
             const file = replaceExt(sfc, `Sfc${index || ''}.${style.lang || 'css'}`);
             const { base, dir } = parse(file);
             const dependencyPath = normalizeStyleDependency(base, STYLE_IMPORT_RE);
-            const cssFile = resolve(dir, './style/index.js');
+            const cssFile = resolve(dir, `./style/index${getScriptExtname()}`);
             let { code } = compileStyle({
                 source: style.content,
                 filename: file,

package/lib/node/config/varlet.config.d.ts

@@ -1,3 +1,4 @@
+import { type CopyOptions } from '@varlet/vite-plugins';
 export interface VarletConfig {
     /**
      * @default `Varlet`
@@ -38,7 +39,7 @@ export interface VarletConfig {
     };
     pc?: Record<string, any>;
     mobile?: Record<string, any>;
-    moduleCompatible?: Record<string, string>;
+    copy?: CopyOptions['paths'];
 }
 export declare function defineConfig(config: VarletConfig): VarletConfig;
 export declare function mergeStrategy(value: any, srcValue: any, key: string): any[] | undefined;

package/lib/node/config/vite.config.js

@@ -1,6 +1,6 @@
 import vue from '@vitejs/plugin-vue';
 import jsx from '@vitejs/plugin-vue-jsx';
-import { markdown, html, inlineCss } from '@varlet/vite-plugins';
+import { markdown, html, inlineCss, copy } from '@varlet/vite-plugins';
 import { ES_DIR, SITE_CONFIG, SITE_DIR, SITE_MOBILE_ROUTES, SITE_OUTPUT_PATH, SITE_PC_ROUTES, SITE_PUBLIC_PATH, VITE_RESOLVE_EXTENSIONS, } from '../shared/constant.js';
 import { get } from 'lodash-es';
 import { resolve } from 'path';
@@ -28,6 +28,7 @@ export function getDevConfig(varletConfig) {
             }),
             jsx(),
             markdown({ style: get(varletConfig, 'highlight.style') }),
+            copy({ paths: get(varletConfig, 'copy', []) }),
             html({
                 data: {
                     logo: get(varletConfig, `logo`),

package/lib/varlet-cli/src/node/config/varlet.config.d.ts

@@ -0,0 +1,44 @@
+export interface VarletConfig {
+    /**
+     * @default `Varlet`
+     * UI library name.
+     */
+    name?: string;
+    /**
+     * @default `var`
+     * Component name prefix
+     */
+    namespace?: string;
+    /**
+     * @default `localhost`
+     * Local dev server host
+     */
+    host?: string;
+    /**
+     * @default `8080`
+     * Local dev server port
+     */
+    port?: number;
+    title?: string;
+    logo?: string;
+    themeKey?: string;
+    defaultLanguage?: 'zh-CN' | 'en-US';
+    /**
+     * @default `false`
+     * Show mobile component on the right.
+     */
+    useMobile?: boolean;
+    lightTheme?: Record<string, string>;
+    darkTheme?: Record<string, string>;
+    highlight?: {
+        style: string;
+    };
+    analysis?: {
+        baidu: string;
+    };
+    pc?: Record<string, any>;
+    mobile?: Record<string, any>;
+}
+export declare function defineConfig(config: VarletConfig): VarletConfig;
+export declare function mergeStrategy(value: any, srcValue: any, key: string): any[] | undefined;
+export declare function getVarletConfig(emit?: boolean): Promise<Required<VarletConfig>>;

package/lib/varlet-cli/src/node/config/varlet.config.js

@@ -0,0 +1,27 @@
+import fse from 'fs-extra';
+import { mergeWith } from 'lodash-es';
+import { VARLET_CONFIG, SITE_CONFIG } from '../shared/constant.js';
+import { outputFileSyncOnChange } from '../shared/fsUtils.js';
+import { isArray } from '@varlet/shared';
+import { pathToFileURL } from 'url';
+const { pathExistsSync, statSync } = fse;
+export function defineConfig(config) {
+    return config;
+}
+export function mergeStrategy(value, srcValue, key) {
+    if (key === 'features' && isArray(srcValue)) {
+        return srcValue;
+    }
+}
+export async function getVarletConfig(emit = false) {
+    const defaultConfig = (await import('./varlet.default.config.js')).default;
+    const config = pathExistsSync(VARLET_CONFIG)
+        ? (await import(`${pathToFileURL(VARLET_CONFIG).href}?_t=${statSync(VARLET_CONFIG).mtimeMs}`)).default
+        : {};
+    const mergedConfig = mergeWith(defaultConfig, config, mergeStrategy);
+    if (emit) {
+        const source = JSON.stringify(mergedConfig, null, 2);
+        outputFileSyncOnChange(SITE_CONFIG, source);
+    }
+    return mergedConfig;
+}

package/lib/varlet-vite-plugins/src/copy.d.ts

@@ -0,0 +1,9 @@
+import type { Plugin } from 'vite';
+export interface CopyPath {
+    from: string;
+    to: string;
+}
+export interface CopyOptions {
+    paths: CopyPath[];
+}
+export declare function copy(options: CopyOptions): Plugin;

package/lib/varlet-vite-plugins/src/copy.js

@@ -0,0 +1,17 @@
+import fse from 'fs-extra';
+const { copyFileSync } = fse;
+export function copy(options) {
+    return {
+        name: 'vite-plugin-varlet-copy',
+        buildStart() {
+            options.paths.forEach((copyPath) => {
+                try {
+                    copyFileSync(copyPath.from, copyPath.to);
+                }
+                catch (e) {
+                    this.warn(e);
+                }
+            });
+        }
+    };
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@varlet/cli",
-  "version": "2.7.0",
+  "version": "2.7.2",
   "type": "module",
   "description": "cli of varlet",
   "bin": {
@@ -66,8 +66,8 @@
     "vite": "4.0.4",
     "vue": "3.2.25",
     "vue-jest": "^5.0.0-alpha.8",
-    "@varlet/vite-plugins": "2.7.0",
-    "@varlet/shared": "2.7.0"
+    "@varlet/vite-plugins": "2.7.2",
+    "@varlet/shared": "2.7.2"
   },
   "devDependencies": {
     "@types/babel__core": "^7.1.12",
@@ -79,8 +79,8 @@
     "@types/node": "^18.7.20",
     "@types/semver": "^7.3.9",
     "@types/inquirer": "^9.0.2",
-    "@varlet/icons": "2.7.0",
-    "@varlet/touch-emulator": "2.7.0"
+    "@varlet/touch-emulator": "2.7.2",
+    "@varlet/icons": "2.7.2"
   },
   "peerDependencies": {
     "@vue/runtime-core": "3.2.16",
@@ -90,8 +90,8 @@
     "lodash-es": "^4.17.21",
     "vue": "3.2.25",
     "vue-router": "4.0.12",
-    "@varlet/icons": "2.7.0",
-    "@varlet/touch-emulator": "2.7.0"
+    "@varlet/icons": "2.7.2",
+    "@varlet/touch-emulator": "2.7.2"
   },
   "scripts": {
     "dev": "tsc --watch",

package/README.en-US.md

@@ -1,198 +0,0 @@
-# @varlet/cli
-
-The out-of-the-box `Vue3 component library` rapid prototyping tool provides a series of commands and tools to solve the problem of component library development
-
-### Feature
-
-- 📦  Out-of-the-box component library development environment
-- 📦  An out-of-the-box component library compilation tool that supports exporting `esm`, `cjs`, `umd` module codes
-- 🛠️  Configuration file-based component library documentation site, support Baidu statistics and theme customization
-- 🛠️  Supports both `sfc` and `tsx` styles for writing component libraries
-- 📦  Out-of-the-box code inspection tool
-- 📦  Out-of-the-box unit testing tools
-- 📦  Out-of-the-box code publishing tool, publishes to both `npm` and `github`, and automatically generates changelogs
-- 💪  Support for `Typescript`
-- 💪  Support `Dark Mode`
-- 🌍  Support `Internationalization`
-- 🚀  Based on `pnpm`
-
-### Quickstart
-
-`@varlet/cli` has built-in `sfc` and `tsx` style component library project templates, which can be generated directly by the `gen` command.
-It is convenient for you to directly enter the component library development.
-
-```shell
-# Install command line tools
-pnpm add @varlet/cli -g
-varlet-cli gen
-```
-
-Then by simply modifying some basic information of the component library template,
-you can start the development of the component library
-
-## Advanced customization
-
-### Configuration file
-
-The `varlet.config.mjs` in the project root directory is used to manage the specific details of the entire component library project.
-The default configuration can be viewed [varlet.default.config.ts](https://github.com/varletjs/varlet/blob/dev/packages/varlet-cli/src/node/config/varlet.default.config.ts)。
-Also refer to `@varlet/ui` [varlet.config.mjs](https://github.com/varletjs/varlet/blob/dev/packages/varlet-ui/varlet.config.mjs)
-
-| Parameter | Description | Type | Default |
-| -- | -------------- | -------- | ---------- |
-| `name` | The full name of the component library, which will be used as the package name | _string_ | `Varlet` |
-| `namespace` | Component library namespace, which will be used as a component prefix | _string_ | `var` |
-| `host` | Development server host | _string_ | `localhost` |
-| `port` | Development server port | _number_ | `8080` |
-| `title` | The title of the component library in the documentation | _string_ | `VARLET` |
-| `logo` | The logo of the component library in the documentation | _string_ | `-` |
-| `defaultLanguage` | Documentation default language | _string_ | `zh-CN` |
-| `useMobile` | Whether to show the preview of the right mobile phone | _boolean_ | `false` |
-| `lightTheme` | Light Mode Documentation Theme | _Record<string, any>_ | `-` |
-| `darkTheme` | Dark Mode Documentation Theme | _Record<string, any>_ | `-` |
-| `highlight` | Documentation snippet style related | _{ style: string }_ | `-` |
-| `analysis` | Document statistics related | _{ baidu: string }_ | `-` |
-| `pc` | PC-side document structure configuration | _Record<string, any>_ | `-` |
-| `mobile` | Mobile side document structure configuration | _Record<string, any>_ | `-` |
-| `moduleCompatible` | Module Compatible Configurations | _Record<string, string>_ | `-` |
-
-### Custom pages
-
-If you want to insert other pages into the component library, you can create a `pages` folder in the project root directory to write a vue component to generate other pages.
-The directory structure is as follows:
-
-```text
-|-- varlet-ui
-  |-- src
-  |-- docs
-  |-- pages
-    |-- sponsor
-      |-- index.vue
-    |-- contributor
-      |-- locale
-        |-- en-US.ts
-      |-- index.vue
-    |-- changelog
-      |-- locale
-        |-- zh-CN.ts
-        |-- en-US.ts
-      |-- index.vue
-```
-
-The resulting route is as follows:
-
-```text
-/zh-CN/sponsor
-/en-US/contributor
-/zh-CN/changelog
-/en-US/changelog
-```
-
-### Commands related
-
-#### Start the development server
-
-```shell
-varlet-cli dev
-```
-
-#### Build documentation site
-
-```shell
-varlet-cli build
-```
-
-#### Preview documentation site
-
-```shell
-varlet-cli preview
-```
-
-#### Build component library code
-
-```shell
-varlet-cli compile
-```
-
-#### Perform all unit tests
-
-```shell
-varlet-cli test
-```
-
-#### Execute unit tests in watch mode
-
-```shell
-varlet-cli test -w
-or
-varlet-cli test -wa
-```
-
-#### Lint code
-
-```shell
-varlet-cli lint
-```
-
-#### Lint commit message
-
-```shell
-varlet-cli commit-lint
-```
-
-#### Generate changelog
-
-```shell
-varlet-cli changelog
-```
-
-#### Release component library
-
-```shell
-varlet-cli release
-```
-
-#### Generate a project template
-
-```shell
-varlet-cli gen
-
-# Options
--n
---name
-  project name
--s
---sfc
-  Generate sfc-style project templates
--t
---tsx
-  Generate tsx-style project templates
--l
---locale
-  Need to support internationalization
-```
-
-#### Create a component template file
-
-```shell
-varlet-cli create
-
-# Options
--n
---name
-  project name
--s
---sfc
-  Generate sfc-style component
--t
---tsx
-  Generate tsx-style component
--l
---locale
-  Need to support internationalization
-```
-
-### Note before release
-
-- 1.`npm` repository registry must set to `npm` official mirror
-- 2.Execute `npm login` to log in