Vue打包之后,默认的访问路径是/index.html,如果需要修改访问路径,可以按照以下步骤来实现。
在Vue项目创建后,可以在config目录下看到index.js文件,打开该文件。
在文件中找到build.assetsPublicPath,该属性表示静态资源的公共路径,即生成的index.html文件中引用静态资源的路径。
默认值为'/',表示静态资源的路径是相对于index.html文件所在的根目录。
如果需要修改访问路径为'/myApp/',则需要将build.assetsPublicPath的值设置为'/myApp/'。
assetsPublicPath: '/myApp/'
在同样的文件中,找到build.assetsSubDirectory,该属性表示静态资源的存放目录。
默认值为'static',表示静态资源存放在项目根目录下的static目录中。
如果需要将静态资源存放在项目根目录下的myApp/static目录下,则需要将build.assetsSubDirectory的值设置为'myApp/static'。
assetsSubDirectory: 'myApp/static'
如果使用了router模式进行页面路由,还需要修改router模式。
在router/index.js文件中,找到创建Router实例的代码:
const router = new Router({ mode: 'history', routes: [...] })
修改mode为'hash',表示使用hash模式进行页面路由。
const router = new Router({ mode: 'hash', routes: [...] })
修改好以上配置后,需要重新执行打包命令进行打包。
执行打包命令:
npm run build
等待打包完成后,可以将生成的文件部署到服务器中,访问路径即为设置的路径。
以上是vue怎么打包修改访问页面路径的详细内容。更多信息请关注PHP中文网其他相关文章!