befly-vite 1.6.11 → 1.7.0

package/README.md

@@ -87,14 +87,14 @@ export default createBeflyViteConfig();
 
 ### 参数说明
 
-| 参数           | 类型                 | 默认值          | 作用                                                |
-| -------------- | -------------------- | --------------- | --------------------------------------------------- |
-| `root`         | `string`             | `process.cwd()` | 项目根目录，用于解析 `src`、扫描 `views` 和生成别名 |
-| `devtool`      | `boolean`            | `false`         | 是否启用 `vite-plugin-vue-devtools`                 |
-| `analyzer`     | `boolean`            | `false`         | 是否启用打包分析，并输出到 `<root>/temp/analyzer`   |
-| `resolvers`    | `Object \| Object[]` | `undefined`     | 追加到自动导入和组件自动注册中的自定义 resolver     |
-| `manualChunks` | `Function \| Object` | `undefined`     | 透传到 `build.rollupOptions.output.manualChunks`    |
-| `viteConfig`   | `Object`             | `{}`            | 最终合并到默认配置上的 Vite 原生配置                |
+| 参数           | 类型                 | 默认值          | 作用                                                 |
+| -------------- | -------------------- | --------------- | ---------------------------------------------------- |
+| `root`         | `string`             | `process.cwd()` | 项目根目录，用于解析 `src`、扫描 `views` 和生成别名  |
+| `devtool`      | `boolean`            | `false`         | 是否启用 `vite-plugin-vue-devtools`                  |
+| `analyzer`     | `boolean`            | `false`         | 是否启用打包分析，并输出到 `<root>/temp/analyzer`    |
+| `resolvers`    | `Object \| Object[]` | `undefined`     | 追加到自动导入和组件自动注册中的自定义 resolver      |
+| `manualChunks` | `Function \| Object` | `undefined`     | 便捷写入 `build.rolldownOptions.output.manualChunks` |
+| `viteConfig`   | `Object`             | `{}`            | 最终合并到默认配置上的 Vite 原生配置                 |
 
 ### 参数细节
 
@@ -173,7 +173,16 @@ export default createBeflyViteConfig({
 
 #### manualChunks
 
-`manualChunks` 会直接透传到 `build.rollupOptions.output.manualChunks`。
+`manualChunks` 是一个便捷入口，会写入 `build.rolldownOptions.output.manualChunks`。
+
+适合：
+
+1. 只想快速传一个 `manualChunks`
+2. 不想为了简单分包额外展开完整的 `build` 配置
+
+如果还要同时配置 `output.entryFileNames`、`chunkFileNames`、`assetFileNames` 等其他构建输出项，推荐直接走 `viteConfig.build.rolldownOptions`。
+
+如果旧项目还在传 `viteConfig.build.rollupOptions`，在 Vite 8 下也还能继续工作；只是新配置更建议直接写 `build.rolldownOptions`。
 
 函数写法：
 
@@ -240,7 +249,43 @@ export default createBeflyViteConfig({
 4. `build.sourcemap`
 5. `build.cssTarget`
 6. `css.lightningcss`
-7. 其他任意 Vite 原生配置
+7. `build.rolldownOptions`
+8. 其他任意 Vite 原生配置
+
+chunks 的推荐方式：
+
+1. 简单场景用顶层 `manualChunks`
+2. 需要完整控制输出结构时，用 `viteConfig.build.rolldownOptions`
+
+示例：
+
+```javascript
+import { createBeflyViteConfig } from "befly-vite";
+import { fileURLToPath } from "node:url";
+
+export default createBeflyViteConfig({
+    root: fileURLToPath(new URL(".", import.meta.url)),
+    viteConfig: {
+        build: {
+            rolldownOptions: {
+                output: {
+                    manualChunks: function (id) {
+                        if (id.includes("tdesign-vue-next") || id.includes("tdesign-icons-vue-next")) {
+                            return "tdesign";
+                        }
+
+                        if (id.includes("node_modules/vue") || id.includes("node_modules/vue-router") || id.includes("node_modules/pinia")) {
+                            return "framework";
+                        }
+                    },
+                    entryFileNames: "assets/[name]-[hash].js",
+                    chunkFileNames: "assets/[name]-[hash].js"
+                }
+            }
+        }
+    }
+});
+```
 
 ## CSS 兼容配置
 
@@ -566,7 +611,7 @@ export default createBeflyViteConfig({
 });
 ```
 
-### 案例 3：打包分析 + 自定义分包
+### 案例 3：打包分析 + Vite 原生分包
 
 ```javascript
 import { fileURLToPath } from "node:url";
@@ -575,9 +620,21 @@ import { createBeflyViteConfig } from "befly-vite";
 export default createBeflyViteConfig({
     root: fileURLToPath(new URL(".", import.meta.url)),
     analyzer: true,
-    manualChunks: function (id) {
-        if (id.includes("node_modules")) {
-            return "vendor";
+    viteConfig: {
+        build: {
+            rolldownOptions: {
+                output: {
+                    manualChunks: function (id) {
+                        if (id.includes("tdesign-vue-next") || id.includes("tdesign-icons-vue-next")) {
+                            return "tdesign";
+                        }
+
+                        if (id.includes("node_modules")) {
+                            return "vendor";
+                        }
+                    }
+                }
+            }
         }
     }
 });

package/index.js

@@ -111,37 +111,24 @@ function createAnalyzerPlugin(appRoot) {
     });
 }
 
-function createDevToolsPlugin() {
-    return VueDevTools();
-}
+function createCssCompatConfig(viteConfig) {
+    const defaultCssTarget = ["chrome107", "edge107", "firefox104", "safari16"];
+    const defaultLightningCssTargets = {
+        chrome: 107 << 16,
+        edge: 107 << 16,
+        firefox: 104 << 16,
+        ios_saf: 16 << 16,
+        safari: 16 << 16
+    };
 
-function createDefaultCssCompatConfig() {
     return {
-        cssTarget: ["chrome107", "edge107", "firefox104", "safari16"],
+        cssTarget: viteConfig.build && Object.hasOwn(viteConfig.build, "cssTarget") ? viteConfig.build.cssTarget : defaultCssTarget,
         lightningcss: {
-            targets: {
-                chrome: 107 << 16,
-                edge: 107 << 16,
-                firefox: 104 << 16,
-                ios_saf: 16 << 16,
-                safari: 16 << 16
-            }
+            targets: viteConfig.css && viteConfig.css.lightningcss && Object.hasOwn(viteConfig.css.lightningcss, "targets") ? viteConfig.css.lightningcss.targets : defaultLightningCssTargets
         }
     };
 }
 
-function applyCssCompatOverrides(finalConfig, viteConfig) {
-    if (viteConfig.build && Object.hasOwn(viteConfig.build, "cssTarget")) {
-        finalConfig.build.cssTarget = viteConfig.build.cssTarget;
-    }
-
-    if (viteConfig.css && viteConfig.css.lightningcss && Object.hasOwn(viteConfig.css.lightningcss, "targets")) {
-        finalConfig.css.lightningcss.targets = viteConfig.css.lightningcss.targets;
-    }
-
-    return finalConfig;
-}
-
 /**
  * 创建 Befly Vite 配置
  * @param {Object} options - 配置选项
@@ -149,7 +136,7 @@ function applyCssCompatOverrides(finalConfig, viteConfig) {
  * @param {boolean} options.devtool - 是否启用 vite-plugin-vue-devtools（可选，默认 false）
  * @param {boolean} options.analyzer - 是否启用 vite-bundle-analyzer（可选，默认 false）
  * @param {Object|Object[]} options.resolvers - 自定义 resolvers（可选）
- * @param {Function|Object} options.manualChunks - 自定义分包配置（可选）
+ * @param {Function|Object} options.manualChunks - 便捷分包配置，会写入 build.rolldownOptions.output.manualChunks（可选）
  * @param {Object} options.viteConfig - 用户自定义配置（可选）
  * @returns {Object} Vite 配置对象
  */
@@ -174,7 +161,7 @@ export function createBeflyViteConfig(options = {}) {
     plugins.push(createRouterPlugin({ routesFolders: routesFolders }));
     plugins.push(createVuePlugin());
     if (devtool) {
-        plugins.push(createDevToolsPlugin());
+        plugins.push(VueDevTools());
     }
     plugins.push(createAutoImportPlugin({ resolvers: resolvers }));
     plugins.push(createComponentsPlugin({ resolvers: resolvers }));
@@ -182,7 +169,7 @@ export function createBeflyViteConfig(options = {}) {
         plugins.push(createAnalyzerPlugin(appRoot));
     }
 
-    const cssCompatConfig = createDefaultCssCompatConfig();
+    const cssCompatConfig = createCssCompatConfig(viteConfig);
 
     const baseConfig = defineConfig({
         base: "./",
@@ -204,7 +191,7 @@ export function createBeflyViteConfig(options = {}) {
             outDir: "dist",
             assetsDir: "assets",
             cssTarget: cssCompatConfig.cssTarget,
-            rollupOptions:
+            rolldownOptions:
                 manualChunks === undefined
                     ? undefined
                     : {
@@ -225,7 +212,13 @@ export function createBeflyViteConfig(options = {}) {
         }
     });
 
-    return applyCssCompatOverrides(mergeConfig(baseConfig, viteConfig), viteConfig);
+    const finalConfig = mergeConfig(baseConfig, viteConfig);
+
+    if (viteConfig.build && Object.hasOwn(viteConfig.build, "cssTarget")) {
+        finalConfig.build.cssTarget = viteConfig.build.cssTarget;
+    }
+
+    return finalConfig;
 }
 
 /**

package/package.json

@@ -1,7 +1,7 @@
 {
     "name": "befly-vite",
-    "version": "1.6.11",
-    "gitHead": "0d256a8b9dd24944bc9f524a91088eecd8ab7ce5",
+    "version": "1.7.0",
+    "gitHead": "976e70ee1f6f959e9def8189bd43ad4c0d454b7f",
     "private": false,
     "description": "Befly Vite 配置预设和插件集合",
     "keywords": [
@@ -37,7 +37,7 @@
         "registry": "https://registry.npmjs.org"
     },
     "dependencies": {
-        "@vitejs/plugin-vue": "^6.0.6",
+        "@vitejs/plugin-vue": "^6.0.7",
         "sass": "^1.99.0",
         "unplugin-auto-import": "^21.0.0",
         "unplugin-vue-components": "^32.0.0",