工作室 网站建设,网站备案不通过,优秀企业网站设计要点,凡科网站设计模板实现思路
通过插件 vite-plugins-html 进行参数配置#xff0c;html 中使用参数#xff0c;实现配置安装插件
$ npm install vite-plugins-html --save-devvite.config.js 中的配置
// 可以动态处理html文件内容的
import { createHtmlPlugin } from vite-plugin-htmlexpo…实现思路
通过插件 vite-plugins-html 进行参数配置html 中使用参数实现配置安装插件
$ npm install vite-plugins-html --save-devvite.config.js 中的配置
// 可以动态处理html文件内容的
import { createHtmlPlugin } from vite-plugin-htmlexport default defineConfig(({command,mode}){return { // 使用插件进行配置固定写法就这么写plugins:[createHtmlPlugin({inject:{data:{// 这个就是要用到的参数title:开发环境的标题,}}})]}
})
index.html 的内容 title% title %/title 上述语法使用 vite.config.js中的变量 !DOCTYPE html
html langen
headmeta charsetUTF-8meta nameviewport contentwidthdevice-width, initial-scale1.0!-- titleDocument/title --title% title %/title
/head
body展示vite对静态图片-svg 的支持br!--引入main.js --script typemodule src./main.js /script/body
/html运行效果