在vue3+vite中实现index.html的模板变量使用

假设index.html需要使用titiel 可以写 <%= title %>

然后再vite.config.js中使用 createHtmlPlugin 来实现；

import {createHtmlPlugin} from 'vite-plugin-html';
//在plugins中使用createHtmlPlugin来创建一个模板变量
plugins: [vue(), createHtmlPlugin({
            inject: {
                data: {
                    title:"Mtab书签",
                },
            },
})],

//在idnex.html中使用
<title><%= title %></title>

打包的时候会将<%= title %>替换为Mtab书签

一般适合vue打包后将index.html用其他的程序模板渲染一些seo信息的用途。