vue-cli打包后index.html出现空白现象、自定义打包文件名

213 阅读1分钟

配置publicPath拒绝出现空页面

不配置导致的问题:打包后index.html出现空白页

配置publicPath

module.exports = {
...
publicPath:'./'
...
}

publicPath官方注释

publicPath的值可以被设置为空字符串 ('') 或是相对路径 ('./'),这样所有的资源都会被链接为相对路径,这样打出来的包可以被部署在任意路径,也可以用在类似 Cordova hybrid 应用的文件系统中。

注意项(以下两种情况不宜使用publicPath的相对路径)

  1. 当使用基于 HTML5 history.pushState 的路由时
  2. 当使用 pages 选项构建多页面应用时

配置outputDir自定义打包文件名

默认值:dist

配置

module.exports = {
...
outputDir:"dist-starqin"
...
}

代码示例:

image.png