befly-vite 1.6.11 → 1.6.12
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +71 -14
- package/index.js +22 -29
- package/package.json +2 -2
package/README.md
CHANGED
|
@@ -87,14 +87,14 @@ export default createBeflyViteConfig();
|
|
|
87
87
|
|
|
88
88
|
### 参数说明
|
|
89
89
|
|
|
90
|
-
| 参数 | 类型 | 默认值 | 作用
|
|
91
|
-
| -------------- | -------------------- | --------------- |
|
|
92
|
-
| `root` | `string` | `process.cwd()` | 项目根目录,用于解析 `src`、扫描 `views` 和生成别名
|
|
93
|
-
| `devtool` | `boolean` | `false` | 是否启用 `vite-plugin-vue-devtools`
|
|
94
|
-
| `analyzer` | `boolean` | `false` | 是否启用打包分析,并输出到 `<root>/temp/analyzer`
|
|
95
|
-
| `resolvers` | `Object \| Object[]` | `undefined` | 追加到自动导入和组件自动注册中的自定义 resolver
|
|
96
|
-
| `manualChunks` | `Function \| Object` | `undefined` |
|
|
97
|
-
| `viteConfig` | `Object` | `{}` | 最终合并到默认配置上的 Vite 原生配置
|
|
90
|
+
| 参数 | 类型 | 默认值 | 作用 |
|
|
91
|
+
| -------------- | -------------------- | --------------- | ---------------------------------------------------- |
|
|
92
|
+
| `root` | `string` | `process.cwd()` | 项目根目录,用于解析 `src`、扫描 `views` 和生成别名 |
|
|
93
|
+
| `devtool` | `boolean` | `false` | 是否启用 `vite-plugin-vue-devtools` |
|
|
94
|
+
| `analyzer` | `boolean` | `false` | 是否启用打包分析,并输出到 `<root>/temp/analyzer` |
|
|
95
|
+
| `resolvers` | `Object \| Object[]` | `undefined` | 追加到自动导入和组件自动注册中的自定义 resolver |
|
|
96
|
+
| `manualChunks` | `Function \| Object` | `undefined` | 便捷写入 `build.rolldownOptions.output.manualChunks` |
|
|
97
|
+
| `viteConfig` | `Object` | `{}` | 最终合并到默认配置上的 Vite 原生配置 |
|
|
98
98
|
|
|
99
99
|
### 参数细节
|
|
100
100
|
|
|
@@ -173,7 +173,16 @@ export default createBeflyViteConfig({
|
|
|
173
173
|
|
|
174
174
|
#### manualChunks
|
|
175
175
|
|
|
176
|
-
`manualChunks`
|
|
176
|
+
`manualChunks` 是一个便捷入口,会写入 `build.rolldownOptions.output.manualChunks`。
|
|
177
|
+
|
|
178
|
+
适合:
|
|
179
|
+
|
|
180
|
+
1. 只想快速传一个 `manualChunks`
|
|
181
|
+
2. 不想为了简单分包额外展开完整的 `build` 配置
|
|
182
|
+
|
|
183
|
+
如果还要同时配置 `output.entryFileNames`、`chunkFileNames`、`assetFileNames` 等其他构建输出项,推荐直接走 `viteConfig.build.rolldownOptions`。
|
|
184
|
+
|
|
185
|
+
如果旧项目还在传 `viteConfig.build.rollupOptions`,在 Vite 8 下也还能继续工作;只是新配置更建议直接写 `build.rolldownOptions`。
|
|
177
186
|
|
|
178
187
|
函数写法:
|
|
179
188
|
|
|
@@ -240,7 +249,43 @@ export default createBeflyViteConfig({
|
|
|
240
249
|
4. `build.sourcemap`
|
|
241
250
|
5. `build.cssTarget`
|
|
242
251
|
6. `css.lightningcss`
|
|
243
|
-
7.
|
|
252
|
+
7. `build.rolldownOptions`
|
|
253
|
+
8. 其他任意 Vite 原生配置
|
|
254
|
+
|
|
255
|
+
chunks 的推荐方式:
|
|
256
|
+
|
|
257
|
+
1. 简单场景用顶层 `manualChunks`
|
|
258
|
+
2. 需要完整控制输出结构时,用 `viteConfig.build.rolldownOptions`
|
|
259
|
+
|
|
260
|
+
示例:
|
|
261
|
+
|
|
262
|
+
```javascript
|
|
263
|
+
import { createBeflyViteConfig } from "befly-vite";
|
|
264
|
+
import { fileURLToPath } from "node:url";
|
|
265
|
+
|
|
266
|
+
export default createBeflyViteConfig({
|
|
267
|
+
root: fileURLToPath(new URL(".", import.meta.url)),
|
|
268
|
+
viteConfig: {
|
|
269
|
+
build: {
|
|
270
|
+
rolldownOptions: {
|
|
271
|
+
output: {
|
|
272
|
+
manualChunks: function (id) {
|
|
273
|
+
if (id.includes("tdesign-vue-next") || id.includes("tdesign-icons-vue-next")) {
|
|
274
|
+
return "tdesign";
|
|
275
|
+
}
|
|
276
|
+
|
|
277
|
+
if (id.includes("node_modules/vue") || id.includes("node_modules/vue-router") || id.includes("node_modules/pinia")) {
|
|
278
|
+
return "framework";
|
|
279
|
+
}
|
|
280
|
+
},
|
|
281
|
+
entryFileNames: "assets/[name]-[hash].js",
|
|
282
|
+
chunkFileNames: "assets/[name]-[hash].js"
|
|
283
|
+
}
|
|
284
|
+
}
|
|
285
|
+
}
|
|
286
|
+
}
|
|
287
|
+
});
|
|
288
|
+
```
|
|
244
289
|
|
|
245
290
|
## CSS 兼容配置
|
|
246
291
|
|
|
@@ -566,7 +611,7 @@ export default createBeflyViteConfig({
|
|
|
566
611
|
});
|
|
567
612
|
```
|
|
568
613
|
|
|
569
|
-
### 案例 3:打包分析 +
|
|
614
|
+
### 案例 3:打包分析 + Vite 原生分包
|
|
570
615
|
|
|
571
616
|
```javascript
|
|
572
617
|
import { fileURLToPath } from "node:url";
|
|
@@ -575,9 +620,21 @@ import { createBeflyViteConfig } from "befly-vite";
|
|
|
575
620
|
export default createBeflyViteConfig({
|
|
576
621
|
root: fileURLToPath(new URL(".", import.meta.url)),
|
|
577
622
|
analyzer: true,
|
|
578
|
-
|
|
579
|
-
|
|
580
|
-
|
|
623
|
+
viteConfig: {
|
|
624
|
+
build: {
|
|
625
|
+
rolldownOptions: {
|
|
626
|
+
output: {
|
|
627
|
+
manualChunks: function (id) {
|
|
628
|
+
if (id.includes("tdesign-vue-next") || id.includes("tdesign-icons-vue-next")) {
|
|
629
|
+
return "tdesign";
|
|
630
|
+
}
|
|
631
|
+
|
|
632
|
+
if (id.includes("node_modules")) {
|
|
633
|
+
return "vendor";
|
|
634
|
+
}
|
|
635
|
+
}
|
|
636
|
+
}
|
|
637
|
+
}
|
|
581
638
|
}
|
|
582
639
|
}
|
|
583
640
|
});
|
package/index.js
CHANGED
|
@@ -111,37 +111,24 @@ function createAnalyzerPlugin(appRoot) {
|
|
|
111
111
|
});
|
|
112
112
|
}
|
|
113
113
|
|
|
114
|
-
function
|
|
115
|
-
|
|
116
|
-
|
|
114
|
+
function createCssCompatConfig(viteConfig) {
|
|
115
|
+
const defaultCssTarget = ["chrome107", "edge107", "firefox104", "safari16"];
|
|
116
|
+
const defaultLightningCssTargets = {
|
|
117
|
+
chrome: 107 << 16,
|
|
118
|
+
edge: 107 << 16,
|
|
119
|
+
firefox: 104 << 16,
|
|
120
|
+
ios_saf: 16 << 16,
|
|
121
|
+
safari: 16 << 16
|
|
122
|
+
};
|
|
117
123
|
|
|
118
|
-
function createDefaultCssCompatConfig() {
|
|
119
124
|
return {
|
|
120
|
-
cssTarget:
|
|
125
|
+
cssTarget: viteConfig.build && Object.hasOwn(viteConfig.build, "cssTarget") ? viteConfig.build.cssTarget : defaultCssTarget,
|
|
121
126
|
lightningcss: {
|
|
122
|
-
targets:
|
|
123
|
-
chrome: 107 << 16,
|
|
124
|
-
edge: 107 << 16,
|
|
125
|
-
firefox: 104 << 16,
|
|
126
|
-
ios_saf: 16 << 16,
|
|
127
|
-
safari: 16 << 16
|
|
128
|
-
}
|
|
127
|
+
targets: viteConfig.css && viteConfig.css.lightningcss && Object.hasOwn(viteConfig.css.lightningcss, "targets") ? viteConfig.css.lightningcss.targets : defaultLightningCssTargets
|
|
129
128
|
}
|
|
130
129
|
};
|
|
131
130
|
}
|
|
132
131
|
|
|
133
|
-
function applyCssCompatOverrides(finalConfig, viteConfig) {
|
|
134
|
-
if (viteConfig.build && Object.hasOwn(viteConfig.build, "cssTarget")) {
|
|
135
|
-
finalConfig.build.cssTarget = viteConfig.build.cssTarget;
|
|
136
|
-
}
|
|
137
|
-
|
|
138
|
-
if (viteConfig.css && viteConfig.css.lightningcss && Object.hasOwn(viteConfig.css.lightningcss, "targets")) {
|
|
139
|
-
finalConfig.css.lightningcss.targets = viteConfig.css.lightningcss.targets;
|
|
140
|
-
}
|
|
141
|
-
|
|
142
|
-
return finalConfig;
|
|
143
|
-
}
|
|
144
|
-
|
|
145
132
|
/**
|
|
146
133
|
* 创建 Befly Vite 配置
|
|
147
134
|
* @param {Object} options - 配置选项
|
|
@@ -149,7 +136,7 @@ function applyCssCompatOverrides(finalConfig, viteConfig) {
|
|
|
149
136
|
* @param {boolean} options.devtool - 是否启用 vite-plugin-vue-devtools(可选,默认 false)
|
|
150
137
|
* @param {boolean} options.analyzer - 是否启用 vite-bundle-analyzer(可选,默认 false)
|
|
151
138
|
* @param {Object|Object[]} options.resolvers - 自定义 resolvers(可选)
|
|
152
|
-
* @param {Function|Object} options.manualChunks -
|
|
139
|
+
* @param {Function|Object} options.manualChunks - 便捷分包配置,会写入 build.rolldownOptions.output.manualChunks(可选)
|
|
153
140
|
* @param {Object} options.viteConfig - 用户自定义配置(可选)
|
|
154
141
|
* @returns {Object} Vite 配置对象
|
|
155
142
|
*/
|
|
@@ -174,7 +161,7 @@ export function createBeflyViteConfig(options = {}) {
|
|
|
174
161
|
plugins.push(createRouterPlugin({ routesFolders: routesFolders }));
|
|
175
162
|
plugins.push(createVuePlugin());
|
|
176
163
|
if (devtool) {
|
|
177
|
-
plugins.push(
|
|
164
|
+
plugins.push(VueDevTools());
|
|
178
165
|
}
|
|
179
166
|
plugins.push(createAutoImportPlugin({ resolvers: resolvers }));
|
|
180
167
|
plugins.push(createComponentsPlugin({ resolvers: resolvers }));
|
|
@@ -182,7 +169,7 @@ export function createBeflyViteConfig(options = {}) {
|
|
|
182
169
|
plugins.push(createAnalyzerPlugin(appRoot));
|
|
183
170
|
}
|
|
184
171
|
|
|
185
|
-
const cssCompatConfig =
|
|
172
|
+
const cssCompatConfig = createCssCompatConfig(viteConfig);
|
|
186
173
|
|
|
187
174
|
const baseConfig = defineConfig({
|
|
188
175
|
base: "./",
|
|
@@ -204,7 +191,7 @@ export function createBeflyViteConfig(options = {}) {
|
|
|
204
191
|
outDir: "dist",
|
|
205
192
|
assetsDir: "assets",
|
|
206
193
|
cssTarget: cssCompatConfig.cssTarget,
|
|
207
|
-
|
|
194
|
+
rolldownOptions:
|
|
208
195
|
manualChunks === undefined
|
|
209
196
|
? undefined
|
|
210
197
|
: {
|
|
@@ -225,7 +212,13 @@ export function createBeflyViteConfig(options = {}) {
|
|
|
225
212
|
}
|
|
226
213
|
});
|
|
227
214
|
|
|
228
|
-
|
|
215
|
+
const finalConfig = mergeConfig(baseConfig, viteConfig);
|
|
216
|
+
|
|
217
|
+
if (viteConfig.build && Object.hasOwn(viteConfig.build, "cssTarget")) {
|
|
218
|
+
finalConfig.build.cssTarget = viteConfig.build.cssTarget;
|
|
219
|
+
}
|
|
220
|
+
|
|
221
|
+
return finalConfig;
|
|
229
222
|
}
|
|
230
223
|
|
|
231
224
|
/**
|
package/package.json
CHANGED