当前位置: 首页 > news >正文

vue3中vite基于vite-plugin-html的多入口打包

先看打包效果
在这里插入图片描述
1、安装vite-plugin-html
2、配置多个入口
在这里插入图片描述
每个入口都要有模板(index.html、App.vue、main.js复制一份,根据实际需求调整三个文件)
3、配置vite.config.js
在这里插入图片描述
4、代码片段


import { createHtmlPlugin } from 'vite-plugin-html'const htmlParams = {minify: true,pages: [{filename: 'index', // filename 默认是template文件名,就是beijing.htmlentry: '/src/main.js',template: 'index.html'},{filename: 'form',entry: '/src/views/resourceManage/fieldFormManage/main.js',template: 'form.html'}]
}createHtmlPlugin(htmlParams)build: {rollupOptions: {output: {assetFileNames: 'assets/[name]-[hash].[ext]', // 静态资源chunkFileNames: 'js/[name]-[hash].js', // 代码分割中产生的 chunkentryFileNames: 'js/[name]-[hash].js', // 指定 chunks 的入口文件compact: true}}}

(完)


http://www.mrgr.cn/news/15818.html

相关文章:

  • npm install速度慢,install超时报错----npm换源;npm i npm install区别
  • 系统功能性能优化:从问题定位到解决方案的系统性分析
  • 文字模型训练分析评论(算法实战)
  • 【Test 006】用图形化和代码的方式实现简单的Qt程序
  • 代码随想录算法训练营第三十一天|56. 合并区间 738.单调递增的数字
  • python脚本开头怎么写
  • PTA L1-028 判断素数
  • 指针进阶(多级指针)
  • C语言入门基础知识(持续更新中)
  • 第十四章 rust集合库介绍
  • JS模块化
  • Redis缓存穿透、缓存击穿与缓存雪崩的详细讲解和案例示范
  • Django+Vue花卉商城系统的设计与实现
  • 逐行输出三个顺序表中共同存在的元素
  • winform中chart的Axis.LabelStyle 属性
  • sqlite数据插入效率
  • 集成电路学习:什么是CRC循环冗余校验
  • cucumber 怎么启动API
  • 对mozjpeg中的函数名进行替换
  • 用矩阵乘法的底层原理来理解“特征融合”