我正在使用vue-service(webpack,还没有vite)运行一个Vue 3应用程序。
因为我想在单独的应用程序中重用一些代码,所以我需要创建一个单独的HTML tempate文件(例如module.html
)来挂载应用程序。
然而,似乎vue-config和/或webpack配置不允许我指定一个不同的html文件作为模板,唯一有效的文件名是index.html
。
我如何告诉我的应用程序使用vue.config.js
文件或vue-cli-service
命令行使用不同的html文件作为模板注入应用程序?
这是我已经尝试过的:
1)设置indexPath
属性
// in vue.config.js
defineConfig({
indexpath: "module.html"
//...
})
字符串
结果:没有变化,index.html
仍然用于呈现页面。
2)使用historyApiFallback
// in vue.config.js
defineConfig({
devServer: {
historyApiFallback: {
index: "module.html",
}
// ...
}
// ...
})
型
结果:没有变化,index.html
仍然用于呈现页面。
3)使用pages
属性
使用pages
属性应该允许我将html-webpack-plugin
配置为使用不同的文件。
// in vue.config.js
defineConfig({
pages: {
index: {
entry: "src/module.js",
template: "module.html",
}
}
// ...
})
型
结果:这将在控制台中创建以下错误:Conflict: Multiple assets emit different content to the same filename index.html
个
这让我想到,在pages
之外一定有一种方法可以设置一个不同的文件名,应用程序试图使用这个文件名。
2条答案
按热度按时间p4tfgftt1#
如果我错了请纠正我,你正在尝试为你的Vue应用程序创建多个布局,对吗?
如果是这种情况,您应该使用
vue-router
嵌套路由来创建实际布局。您可以在这里查看更多详细信息https://stackblitz.com/edit/vue-t1uatq
fumotvh32#
你是否尝试给予绝对路径到您的html文件在这里
1.设置indexPath属性
//在vue.js.js
字符串