vuecli3.x 打包部署到子目录相关配置

部署在http://www.xxx.com/域名的根目录,不需要过多配置,正常配置就可以跑起来;

部署在http://www.xxx.com/xxx这种情况时,需要添加如下配置

一、vue.config.js

module.exports = {
    // 基本路径
    publicPath: process.env.NODE_ENV === 'production' ? '/xxx/' : '/',
    ......
}

二、路由配置参数

new Router({
    mode: 'history',
    base: process.env.NODE_ENV === 'production' ? '/xxx/' : '/',
    scrollBehavior: () => ({ y: 0 }),
    ......
})

修改这两个地方就可以正常跑起来了。

至于nginx配置可以参照官方文档


前端开发
记录前端开发那些事
292 声望
6 粉丝
0 条评论
推荐阅读
ngrok 内网穿透工具使用、远程办公 私活利器
1、下载:[链接]2、注册账号3、下载后解压,放到目录/usr/local/bin4、添加环境变量 {代码...} 5、添加本地token【token在个人中心里面会自动生成一个】ngrok authtoken xxxxx6、代理本地端口【比如本地起的服务...

sole阅读 677

Vue中的diff算法
diff算法是一种通过同层的树节点进行比较的高效算法,避免了对树进行逐层搜索遍历,所以时间复杂度只有 O(n)。diff算法的在很多场景下都有应用,例如在 vue 虚拟 dom 渲染成真实 dom 的新旧 VNode 节点比较更新时...

款冬27阅读 13.4k评论 7

给我实现一个前端的 Excel 导入和导出功能
前言【负责人 A】:现在报表部分基于接口的 Excel 的导入和导出功能有点慢,前端这边能不能实现一下这个功能,然后我们在比对看看效果!【切图仔 B】: 接口这边不能优化一下吗?比如排查下慢的原因什么的。【负...

熊的猫19阅读 2.5k

封面图
vue-property-decorator使用手册
@Component 装饰器可以接收一个对象作为参数,可以在对象中声明 components ,filters,directives等未提供装饰器的选项,也可以声明computed,watch等

似曾相识17阅读 29.1k评论 7

一个开源vue网站博客,nuxt开源网站,前后端分离项目
开媛笔记,基于nuxt ssr首屏服务器端渲染 。用于分享、记录、交流和学习,希望可以帮助到小伙伴们。同时网站在不断更新,创造属于猿(媛)的世界 -$Bao Yalong ..Let's Go! [链接]

jigsaw16阅读 8.4k评论 3

你知道前端水印功能是怎么实现的吗?
前一段时间由于项目需要实现水印功能,于是去了解了相关的内容后,基于 Vue 的实现了一个 v-watermark 指令完成了对应的功能,其实整体内容并不复杂!

熊的猫14阅读 1.7k

封面图
2022 你还不会微前端吗 (上) — 从巨石应用到微应用
微前端系列分为 上/下 两篇,本文为 上篇 主要还是了解微前端的由来、概念、作用等,以及基于已有的微前端框架进行实践,并了解微前端的核心功能所在,而在下篇 2022 你还不会微前端吗 (下) — 揭秘微前端核心原理...

熊的猫14阅读 1.6k

封面图
292 声望
6 粉丝
宣传栏