1.说明
Vite配置-build.polyfilldynamicimport英文说明
拥抱Vite2.0 系列(二) - 知乎
原文:
-
类型: boolean
-
默认: true
,除非build.target
是esnext
。
是否自动注入动态导入polyfill。
polyfill
会自动注入到每个index.html
条目的代理模块中。如果通过build.rollupOptions.input
配置成使用非html
的自定义条目,那么就需要手动导入自定义条目中的polyfill
:
import 'vite/dynamic-import-polyfill'
注意:polyfill
不适用于库模式。如果你需要支持没有本地动态导入的浏览器,你可能应该避免在你的库中使用它。
Vite
使用ES
动态导入作为代码分割点。生成的代码还将使用动态导入来加载异步块。然而,本机ESM
动态导入支持是在ESM
之后通过脚本标记实现的,并且这两个特性在浏览器支持方面存在差异。Vite
会自动注入一个轻量级的动态导入填充来消除这种差异。
如果你知道你的目标浏览器只支持本机动态导入,你可以通过build.polyfillDynamicImport
显式禁用此特性。
总之VbenAdmin
中在生产环境将此项禁用了。如果打包后的项目有问题,而本地运行没问题。那么尝试打开它,因为这个配置貌似和浏览器有关。
2.创建全局常量
这个输出路径我们把它写成一个全局常量。全局常量保存在:build\constant.ts
/**
* 在生产环境中输入的配置文件名称。
*/
export const GLOB_CONFIG_FILE_NAME = '_app.config.js';
export const OUTPUT_DIR = 'dist';
然后在vite.config.ts
中引用:
// ...
import { OUTPUT_DIR } from './build/constant';
// ...
export default ({ command, mode }: ConfigEnv): UserConfig => {
// ...
return {
// ...
build: {
outDir: OUTPUT_DIR,
},
// ...
};
};
上一章
第三十五章-Vite配置-build.outDir
下一章
第三十七章-Vite配置-build.terserOptions