默认情况下,assetFileNames 的值为 'assets/[name].[hash][ext]'。 如果你想自定义资源文件名,你可以在 vite.config.js 文件中配置 build 选项,例如: // vite.config.js export default { build: { rollupOptions: { output: { assetFileNames: 'static/[name].[hash][ext]' } } } } 在这个例子...
external: ['vue'], output: { // 在 UMD 构建模式下为这些外部化的依赖提供一个全局变量 globals: { vue:'Vue' } } } } }) entry:指定要打包的入口文件。 name:包的名称 fileName:包文件的名称,默认是umd和es两个文件。 sourcemap:是否生成 .map 文件,默认是不会生成的,如果需要的话需要设置为 true。
（1）打包main.js 代码如下：const path = require('path')module.exports = { mode: 'development', //设置开发模式 entry: path.resolve(__dirname, './src/main.js'), //打包入口 output: { //打包到哪里去 path: path.resolve(__dirname, 'dist'),filename: 'js/[name].js', //默认文件名m...
使用extensions来指定需要解析的文件后缀,避免不必要的文件搜索。 配置entry和output: 合理地设置entry,避免不必要的打包入口。 在output中设置filename和chunkFilename,使用[contenthash]代替[hash],以便更精确地缓存文件。 二、减少打包文件数量 按需加载: 使用Webpack的动态导入功能(如import()),实现代码分割和按需加载。
{'@':fileURLToPath(newURL('./src',import.meta.url)),},},build:{outDir,emptyOutDir:true,},rollupOptions:{input:entry,output:{dir:`dist/${dir}`,assetFileNames:'[ext]/[name]-[hash].[ext]',chunkFileNames:'js/[name]-[hash].js',entryFileNames:'js/[name]-[hash].js',},},...
{drop_console:true,drop_debugger:true,},},//打包文件按照类型分文件夹显示rollupOptions:{input:{main:path.resolve(__dirname,'src/index.html'),},output:{chunkFileNames:'js/[name]-[hash].js',entryFileNames:'js/[name]-[hash].js',assetFileNames:'[ext]/[name]-[hash].[ext]',},},...
vite.config.js build: { rollupOptions: { output: { entryFileNames: `assets/[name].${timestamp}.js`, chunkFileNames: `assets/[name].${timestamp}.js`, a
1421 filename: string; 1422 server?: ViteDevServer; 1423 bundle?: OutputBundle; 1424 chunk?: OutputChunk; 1425 originalUrl?: string; 1426 } 1427 1428 export declare type IndexHtmlTransformHook = (html: string, ctx: IndexHtmlTransformContext) => IndexHtmlTransformResult | void | ...
output: { chunkFileNames:'js/[name]-[hash].js',// 引入文件名的名称 entryFileNames:'js/[name]-[hash].js',// 包的入口文件名称 assetFileNames:'[ext]/[name]-[hash].[ext]',// 资源文件像 字体,图片等 } } } 查看项目的依赖,找出大块头 ...
log(path.dirname(__filename)) // Prints: /Users/mjr 阶段小结:通过开源项目 vite 配置,大体了解 vite.config.ts/js 在项目启动的某个时机执行 后面我们只需要,用到什么配置了解什么配置就好。装包,然后配置。看文档了解用法。 rollup 在看了一个 vite 的实际项目之后,还要了解一个内容 rollup git clone ...