chore: try another branch to fix deployment

Co-authored-by: renovate[bot] <29139614+renovate[bot]@users.noreply.github.com>

.github/workflows/deploy-v4-site.yml

@@ -33,7 +33,7 @@ jobs:
         run: npm run build:site
 
       - name: Deploy for Gitee 🚀
-        uses: JamesIves/github-pages-deploy-action@v4.4.1
+        uses: JamesIves/github-pages-deploy-action@v4.6.0
         with:
           branch: gh-pages
           folder: packages/vant/site-dist
@@ -57,9 +57,9 @@ jobs:
             vant-use/**/*
 
       - name: Deploy for GitHub 🚀
-        uses: JamesIves/github-pages-deploy-action@v4.4.1
+        uses: JamesIves/github-pages-deploy-action@v4.6.0
         with:
-          branch: main
+          branch: gh-pages
           folder: packages/vant/site-dist
           token: ${{ secrets.VANT_UI_TOKEN }}
           repository-name: vant-ui/vant-ui.github.io

package.json

@@ -17,9 +17,9 @@
     "*.{ts,tsx,js,vue}": "eslint --fix"
   },
   "engines": {
-    "pnpm": ">= 8.8.0"
+    "pnpm": ">= 9.0.0"
   },
-  "packageManager": "pnpm@8.14.1",
+  "packageManager": "pnpm@9.0.4",
   "devDependencies": {
     "@vant/cli": "workspace:*",
     "@vant/eslint-config": "workspace:*",

packages/vant-cli/changelog.md

@@ -1,5 +1,12 @@
 # 更新日志
 
+## v7.0.2
+
+`2024-04-20`
+
+- 支持读取 `rsbuild.config.*` 配置文件
+- 支持编译 Vue SFC scopeId
+
 ## v7.0.1
 
 `2024-04-14`

packages/vant-cli/docs/config.md

@@ -1,6 +1,8 @@
 # Config
 
 - [Config](#----)
+  - [rsbuild.config.mjs](#rsbuildconfigmjs)
+  - [vite.config.mjs](#viteconfigmjs)
   - [vant.config.mjs](#vantconfigmjs)
     - [name](#name)
     - [build.css.base](#buildcssbase)
@@ -8,7 +10,6 @@
     - [build.site.publicPath](#buildsitepublicpath)
     - [build.srcDir](#buildsrcdir)
     - [build.namedExport](#buildnamedexport)
-    - [build.configureVite](#buildconfigurevite)
     - [build.packageManager](#buildpackagemanager)
     - [site.title](#sitetitle)
     - [site.logo](#sitelogo)
@@ -24,6 +25,34 @@
     - [Default Config](#-----1)
   - [browserslist](#browserslist)
 
+## rsbuild.config.mjs
+
+Vant CLI uses [Rsbuild](https://github.com/web-infra-dev/rsbuild) to build the documentation site. You can create an Rsbuild configuration file in the same directory as `vant.config.mjs`. The contents of the file will be automatically read by Vant CLI.
+
+```js
+// rsbuild.config.mjs or rsbuild.config.ts
+export default {
+  plugins: [
+    // Configure Rsbuild plugins
+  ],
+  dev: {
+    // Options related to local development
+  },
+  html: {
+    // Options related to HTML generation
+  },
+  // Other options
+};
+```
+
+> Please refer to [Configure Rsbuild](https://rsbuild.dev/guide/basic/configure-rsbuild) for more information.
+
+## vite.config.mjs
+
+Vant Cli uses Vite to build component library code. You can create a Vite configuration file in the same directory as `vant.config.mjs`. In this file, you can add any Vite configuration.
+
+> Please refer to [Vite Configuration](https://vitejs.dev/config/) to learn more.
+
 ## vant.config.mjs
 
 `vant.config.mjs` includes bundle and documentation site config. Please create this file and place it in your project root directory. Here is a basic example:
@@ -192,28 +221,6 @@ module.exports = {
 };
 ```
 
-```js
-module.exports = {
-  build: {
-    configureVite(config) {
-      const { BUILD_TARGET } = process.env;
-
-      if (BUILD_TARGET === 'package') {
-        // component library bundle config
-      }
-
-      if (BUILD_TARGET === 'site') {
-        // documentation site bundle config
-      }
-
-      return config;
-    },
-  },
-};
-```
-
-Note that you are not allowed to import vite plugins in `vant.config.mjs`, because the file will be bundled into the website code.
-
 If you need to configure some vite plugins, please create a `vite.config.ts` file in the same directory of `vant.config.mjs`, in which you can add any vite configuration (this feature requires @vant/cli 5.1.0).
 
 ### build.packageManager

packages/vant-cli/docs/config.zh-CN.md

@@ -1,6 +1,8 @@
 # 配置指南
 
 - [配置指南](#----)
+  - [rsbuild.config.mjs](#rsbuildconfigmjs)
+  - [vite.config.mjs](#viteconfigmjs)
   - [vant.config.mjs](#vantconfigmjs)
     - [name](#name)
     - [build.css.base](#buildcssbase)
@@ -8,7 +10,6 @@
     - [build.site.publicPath](#buildsitepublicpath)
     - [build.srcDir](#buildsrcdir)
     - [build.namedExport](#buildnamedexport)
-    - [build.configureVite](#buildconfigurevite)
     - [build.packageManager](#buildpackagemanager)
     - [site.title](#sitetitle)
     - [site.logo](#sitelogo)
@@ -24,6 +25,34 @@
     - [默认配置](#-----1)
   - [browserslist](#browserslist)
 
+## rsbuild.config.mjs
+
+Vant CLI 使用 [Rsbuild](https://github.com/web-infra-dev/rsbuild) 来构建文档站点，你可以在 `vant.config.mjs` 的同级目录下创建 Rsbuild 的配置文件，文件内容会被 Vant CLI 自动读取。
+
+```js
+// rsbuild.config.mjs 或 rsbuild.config.ts
+export default {
+  plugins: [
+    // 配置 Rsbuild 插件
+  ],
+  dev: {
+    // 与本地开发有关的选项
+  },
+  html: {
+    // 与 HTML 生成有关的选项
+  },
+  // 其他选项
+};
+```
+
+> 请参考 [配置 Rsbuild](https://rsbuild.dev/zh/guide/basic/configure-rsbuild) 了解更多。
+
+## vite.config.mjs
+
+Vant Cli 使用 Vite 来构建组件库代码，你可以在 `vant.config.mjs` 的同级目录下创建 Vite 的配置文件，在该文件中你可以添加任意的 Vite 配置。
+
+> 请参考 [Vite 配置](https://vitejs.dev/config/) 了解更多。
+
 ## vant.config.mjs
 
 `vant.config.mjs` 中包含了 `vant-cli` 的打包配置和文档站点配置，请创建此文件并置于项目根目录下。下面是一份基本配置的示例：
@@ -174,50 +203,6 @@ module.exports = {
 
 开启此选项后，会通过 `export * from 'xxx'` 导出组件内部的所有模块、类型定义。
 
-### build.configureVite
-
-- Type: `(config: InlineConfig): InlineConfig | undefined`
-- Default: `undefined`
-
-vant-cli 使用 vite 来构建组件库和文档站点，通过 `configureVite` 选项可以自定义 [vite 配置](https://vitejs.dev/config/)（从 4.0.0 版本开始支持）。
-
-```js
-module.exports = {
-  build: {
-    configureVite(config) {
-      config.server.port = 3000;
-      return config;
-    },
-  },
-};
-```
-
-在自定义配置时，可以通过 `process.env.BUILD_TARGET` 对构建目标进行区分：
-
-```js
-module.exports = {
-  build: {
-    configureVite(config) {
-      const { BUILD_TARGET } = process.env;
-
-      if (BUILD_TARGET === 'package') {
-        // 修改组件库构建配置
-      }
-
-      if (BUILD_TARGET === 'site') {
-        // 修改文档站点构建配置
-      }
-
-      return config;
-    },
-  },
-};
-```
-
-注意，由于 `vant.config.mjs` 文件会被打包到文档网站的代码中，因此 `configureVite` 中不允许引用 vite 插件。
-
-如果需要配置 vite 插件，可以在 `vant.config.mjs` 的同级目录下创建 `vite.config.ts` 文件，在该文件中你可以添加任意的 vite 配置（该特性从 @vant/cli 5.1.0 版本开始支持）。
-
 ### build.packageManager
 
 - Type: `'npm' | 'yarn' | 'pnpm' | 'bun'`

packages/vant-cli/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vant/cli",
-  "version": "7.0.1",
+  "version": "7.0.2",
   "type": "module",
   "main": "lib/index.js",
   "typings": "lib/index.d.ts",
@@ -43,15 +43,15 @@
     "@types/lodash": "^4.17.0",
     "@types/markdown-it": "^13.0.7",
     "rimraf": "^5.0.5",
-    "vue": "^3.4.21"
+    "vue": "^3.4.23"
   },
   "dependencies": {
     "@babel/core": "^7.24.4",
     "@babel/preset-typescript": "^7.24.1",
-    "@rsbuild/core": "0.6.1",
-    "@rsbuild/plugin-babel": "0.6.1",
-    "@rsbuild/plugin-vue": "0.6.1",
-    "@rsbuild/plugin-vue-jsx": "0.6.1",
+    "@rsbuild/core": "0.6.4",
+    "@rsbuild/plugin-babel": "0.6.4",
+    "@rsbuild/plugin-vue": "0.6.4",
+    "@rsbuild/plugin-vue-jsx": "0.6.4",
     "@vant/eslint-config": "workspace:^",
     "@vant/touch-emulator": "workspace:^",
     "@vitejs/plugin-vue": "^4.6.2",
@@ -82,6 +82,6 @@
     "transliteration": "^2.3.5",
     "typescript": "^5.0.4",
     "vite": "^5.0.12",
-    "vue-router": "^4.3.0"
+    "vue-router": "^4.3.2"
   }
 }

packages/vant-cli/src/compiler/compile-sfc.ts

@@ -6,6 +6,7 @@ import {
   SFCBlock,
   compileTemplate,
   compileScript,
+  compileStyle,
 } from 'vue/compiler-sfc';
 import { replaceExt } from '../common/index.js';
 
@@ -37,7 +38,7 @@ function injectRender(script: string, render: string) {
 }
 
 function injectScopeId(script: string, scopeId: string) {
-  script += `\n${VUEIDS}._scopeId = '${scopeId}'`;
+  script += `\n${VUEIDS}.__scopeId = '${scopeId}'`;
   return script;
 }
 
@@ -75,7 +76,8 @@ export async function compileSfc(filePath: string): Promise<any> {
   const { template, styles } = descriptor;
 
   const hasScoped = styles.some((s) => s.scoped);
-  const scopeId = hasScoped ? `data-v-${hash(source)}` : '';
+  const scopeId = hasScoped ? hash(source) : '';
+  const scopeKey = scopeId ? `data-v-${scopeId}` : '';
 
   // compile js part
   if (descriptor.script || descriptor.scriptSetup) {
@@ -87,35 +89,32 @@ export async function compileSfc(filePath: string): Promise<any> {
       new Promise((resolve) => {
         let script = '';
 
-        let bindingMetadata;
-        if (descriptor.scriptSetup) {
-          const { bindings, content } = compileScript(descriptor, {
-            id: scopeId,
-          });
-          script += content;
-          bindingMetadata = bindings;
-        } else {
-          script += descriptor.script!.content;
-        }
+        const { bindings, content } = compileScript(descriptor, {
+          id: scopeKey,
+        });
 
+        script += content;
         script = injectStyle(script, styles, filePath);
+
         script = script.replace(EXPORT, `const ${VUEIDS} =`);
 
         if (template) {
           const render = compileTemplate({
-            id: scopeId,
+            id: scopeKey,
             source: template.content,
+            scoped: !!scopeKey,
             filename: filePath,
             compilerOptions: {
-              bindingMetadata,
+              scopeId: scopeKey,
+              bindingMetadata: bindings,
             },
           }).code;
 
           script = injectRender(script, render);
         }
 
-        if (scopeId) {
-          script = injectScopeId(script, scopeId);
+        if (scopeKey) {
+          script = injectScopeId(script, scopeKey);
         }
 
         script += `\n${EXPORT} ${VUEIDS}`;
@@ -136,20 +135,14 @@ export async function compileSfc(filePath: string): Promise<any> {
     ...styles.map(async (style, index: number) => {
       const cssFilePath = getSfcStylePath(filePath, style.lang || 'css', index);
 
-      const styleSource = trim(style.content);
+      const styleSource = compileStyle({
+        source: style.content,
+        filename: path.basename(cssFilePath),
+        scoped: style.scoped,
+        id: scopeId,
+      });
 
-      // TODO support scoped
-      // if (style.scoped) {
-      //   styleSource = compileUtils.compileStyle({
-      //     id: scopeId,
-      //     scoped: true,
-      //     source: styleSource,
-      //     filename: cssFilePath,
-      //     preprocessLang: style.lang,
-      //   }).code;
-      // }
-
-      return outputFile(cssFilePath, styleSource);
+      return outputFile(cssFilePath, trim(styleSource.code));
     }),
   );
 

packages/vant-cli/src/compiler/compile-site.ts

@@ -3,7 +3,11 @@ import { getVantConfig, setBuildTarget } from '../common/index.js';
 import { getTemplateParams } from './get-template-params.js';
 import { genPackageEntry } from './gen-package-entry.js';
 import { genStyleDepsMap } from './gen-style-deps-map.js';
-import type { RsbuildConfig } from '@rsbuild/core';
+import {
+  loadConfig,
+  mergeRsbuildConfig,
+  type RsbuildConfig,
+} from '@rsbuild/core';
 import { RspackVirtualModulePlugin } from 'rspack-plugin-virtual-module';
 import { CSS_LANG } from '../common/css.js';
 import { genSiteMobileShared } from '../compiler/gen-site-mobile-shared.js';
@@ -95,9 +99,11 @@ export async function compileSite(isProd = false) {
     },
   };
 
+  const userRsbuildConfig = await loadConfig({ cwd: process.cwd() });
+
   const rsbuild = await createRsbuild({
     cwd: SITE_SRC_DIR,
-    rsbuildConfig,
+    rsbuildConfig: mergeRsbuildConfig(rsbuildConfig, userRsbuildConfig.content),
   });
 
   if (isProd) {

packages/vant-compat/package.json

@@ -36,9 +36,9 @@
   "author": "chenjiahan",
   "license": "MIT",
   "devDependencies": {
-    "@vue/runtime-core": "^3.4.21",
+    "@vue/runtime-core": "^3.4.23",
     "vant": "workspace:*",
-    "vue": "^3.4.21",
+    "vue": "^3.4.23",
     "esbuild": "^0.20.2",
     "rimraf": "^5.0.5",
     "typescript": "^5.0.4"

packages/vant-eslint-config/package.json

@@ -23,7 +23,7 @@
     "@typescript-eslint/eslint-plugin": "^6.2.1",
     "@typescript-eslint/parser": "^6.2.1",
     "eslint-config-prettier": "^9.1.0",
-    "eslint-plugin-vue": "^9.24.1"
+    "eslint-plugin-vue": "^9.25.0"
   },
   "devDependencies": {
     "eslint": "^8.57.0",

packages/vant-use/package.json

@@ -41,7 +41,7 @@
     "esbuild": "^0.20.2",
     "rimraf": "^5.0.5",
     "typescript": "^5.0.4",
-    "vue": "^3.4.21"
+    "vue": "^3.4.23"
   },
   "peerDependencies": {
     "vue": "^3.0.0"

packages/vant/package.json

@@ -48,13 +48,13 @@
   "dependencies": {
     "@vant/popperjs": "workspace:^",
     "@vant/use": "workspace:^",
-    "@vue/shared": "^3.4.21"
+    "@vue/shared": "^3.4.23"
   },
   "peerDependencies": {
     "vue": "^3.0.0"
   },
   "devDependencies": {
-    "@types/node": "^18.19.29",
+    "@types/node": "^18.19.31",
     "@vant/area-data": "workspace:*",
     "@vant/cli": "workspace:*",
     "@vant/eslint-config": "workspace:*",
@@ -62,7 +62,7 @@
     "@vitejs/plugin-vue": "^4.6.2",
     "@vitejs/plugin-vue-jsx": "^3.1.0",
     "@vitest/coverage-istanbul": "^1.1.3",
-    "@vue/runtime-core": "^3.4.21",
+    "@vue/runtime-core": "^3.4.23",
     "@vue/test-utils": "^2.4.5",
     "csstype": "^3.1.3",
     "diffable-html": "^5.0.0",
@@ -71,8 +71,8 @@
     "vite": "^5.0.12",
     "vitest": "^1.1.3",
     "vitest-canvas-mock": "^0.3.3",
-    "vue": "^3.4.21",
-    "vue-router": "^4.3.0"
+    "vue": "^3.4.23",
+    "vue-router": "^4.3.2"
   },
   "sideEffects": [
     "es/**/style/*",