vue项目部署到子路径下需要更改的设置

vue项目部署到服务器上会默认为例如ROOT的文件夹下，这样会直接访问改文件夹下的index.html文件。
假如现在有需求是把项目放到某一个子路径下，如果不更改设置会出现资源不加载，引用js文件找不到，刷新页面报404等问题。
1、在public文件夹下引用js文件，路径写成 ./
2、在config/index.js文件中，打包路径应写成 /子路径名/ 例如：/child/。
3、在路由文件中修改base属性，这个是防止刷新跳回默认路径的。
export default new Router({
mode: ‘history’,
base: ‘/child/’,
routes: [
{
path: ‘/’,
name: ‘home’,
component: home
}
]
})
后台我是用的nginx，使用的history模式。如果是hash模式最后改成history模式。需要改成
try_files $uri $uri/ /child/index.html;
以上更改就OK了。

vue项目部署到子路径下需要更改的设置相关推荐

vue项目部署在二级目录下
一般情况下,前端项目部署在各自端口根目录下.但是如果服务器端口限制等因素,多个项目共享一个端口,就需要部署在二级目录下. 但是会面临几个问题服务器配置前端静态资源路径配置前端请求路径写法前端路 ...
Vue——项目部署到非根目录下的解决方案
问题描述同一个生产部署项目,基内外网的访问路径并不相同,内网是基于域名根目录来访问,而外网却指向了一个子目录. eg. : vue-router: history模式内网环境:192.168.1. ...
vue项目部署后，font下文件夹样式都找不到
element-icons 和 fontawesome-webfont 等字体无法正常展示解决方法方法1 在build的文件夹里面的utils.js里面publicPath: '-/-/' 方法2 ...
Vue项目部署遇到的问题及解决方案
写在前面 Vue-Router 有两种模式,默认是 hash 模式,另外一种是 history 模式. hash:也就是地址栏里的 # 符号.比如 http://www.example/#/hello ...
将springboot项目和vue项目部署到windows 2016 server（服务器）
将springboot项目和vue项目部署到服务器 1.服务器环境配置 1.1 服务器需要安装的环境 1.2 服务器需要配置的入站与进站规则 2.springboot项目的打包 2.1 springb ...
vue项目部署到nginx
vue项目部署到nginx 一.vue项目打包修改config/index.js的assetsPublicPath为 ./(注意一定是build里面的,下面dev中也有这个配置) 这个路径的配置很重 ...
ssm项目直接加html文件,如何把ssm项目和vue项目部署在云服务器（上）
如何把ssm项目和vue项目部署在云服务器(上) 如何把ssm项目和vue项目部署在云服务器(上) 一.引入 URL的概念理解在WWW上,每一信息资源都有统一的且在网上唯一的地址,该地址就叫URL( ...
vue项目部署到服务器后浏览器标签上的小图标消失不见
背景: 最近在开发项目过程中发现一个问题,项目部署到服务器后在浏览器打开,会发现浏览器标签上的小图标消失不见了.百度查找问题,网上给出了许多解决的方案,例如清除浏览器缓存.把图标的相对路径改成绝对路径 ...
Vue项目部署及使用WebStorm开发Vue
Vue项目部署及使用WebStorm开发Vue Vue项目部署搭建Vue环境新建Vue项目使用WebStorm开发Vue WebStorm相关配置配置路由全局页面App.vue 全局引入组件 ...

vue项目部署到子路径下需要更改的设置

vue项目部署到子路径下需要更改的设置相关推荐

最新文章

热门文章