vue通过(NGINX)部署在子目录或者二级目录实践
1、修改 router/index.js
添加一行
base: 'admin',

2、然后修改 config/index.js
增加一行
const assetsPublicPath = '/admin/'
然后修改 下面两处 assetsPublicPath 的值为定义的变量

3、部署时,通过NGINX的反向代理
首先,给需要部署的项目定义一个 NGINX 的 server
server {
listen ;
location / {
# vue h5 history mode 时配置
try_files $uri $uri/ /index.html;
root /home/html/travel_admin/dist;
index index.html index.htm;
}
}
再到配置域名的主配置server上做反向代理
server {
listen ;
server_name web.zjj7.com;
location / {
# 这里是根目录的项目
try_files $uri $uri/ /index.html;
root /home/html/travel/dist;
index index.html index.htm;
}
# 这里是需要部署的二级目录应用配置
location ^~/admin/ {
proxy_redirect off;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_pass http://127.0.0.1:8001/;
}
}
这要重启NGINX以后,部署就完成了

vue通过(NGINX)部署在子目录或者二级目录实践的更多相关文章
- vue history 模式打包部署在域名的二级目录的配置指南
最近在做项目,需要把项目部署在域名下的二级目录,并且是在用vue-router的history 模式. 我们都知道vue-router 的两种前端基本访问模式 hash 和history .hash ...
- vue+uwsgi+nginx部署路飞学城
vue+uwsgi+nginx部署路飞学城 有一天,老男孩的苑日天给我发来了两个神秘代码,听说是和mjj的结晶 超哥将这两个代码,放到了一个网站上,大家可以自行下载 路飞学城django代码 ht ...
- linux vue uwsgi nginx 部署路飞学城 安装 vue
vue+uwsgi+nginx部署路飞学城 有一天,老男孩的苑日天给我发来了两个神秘代码,听说是和mjj的结晶 超哥将这两个代码,放到了一个网站上,大家可以自行下载 路飞学城django代码#这个代码 ...
- Vue 之 Nginx 部署
nginx 下载地址:http://nginx.org/en/download.html 下载后直接解压,cmd 进入到解压目录运行 start nginx 即可启动 常用命令: nginx -s s ...
- Nginx 前端项目配置 包含二级目录和接口代理
Nginx是目前用的比较多的一个前端服务器 其优点是配置简单修改一下server就能用 并发性能比较好,具体怎么好就看这个吧 开撸 1.找到nginx (liunx系统,已安装) whereis ng ...
- 修改vue的配置项支持生产环境下二级目录访问的方法
本文主要记录如何配置vue的打包文件配置项,使打包后的文件可以支持二级目录的访问. 1.常规打包 在实际的项目中,我们通常都使用 npm run build 直接打包文件后丢到服务器上访问 打包后的文 ...
- vue+uwsgi+nginx部署luffty项目
在部署项目之前本人已经将前端代码和后端代码发布在了一个网站上,大家可自行下载,当然如果有Xftp工具也可以直接从本地导入. django代码 https://files.cnblogs.com/fil ...
- vue+uwsgi+nginx部署前后端分离项目
前后端分离,vue前端提供静态页面,且可以向后台发起get,post等restful请求. django后台提供数据支撑,返回json数据,返回给vue,进行数据页面渲染 后端 创建虚拟环境 解决dj ...
- vue+uwsgi+nginx部署项目
首先先下载好前后端项目 先从前端vue搞起 要在服务器上,编译打包vue项目,必须得有node环境 下载node二进制包,此包已经包含node,不需要再编译 wget https://nodejs.o ...
随机推荐
- js 变量、函数提升 与js的预编译有关
参考网址:http://www.codesec.net/view/178491.html 先简单理解下作用域的概念,方便对变量与函数提升的概念的理解 function foo() { var x = ...
- jQuery Mobile中的页面加载与跳转机制
第一次做用jQuery Mobile做东西,发现一些跟平时的思维习惯不太一样的.其中这个框架的页面加载机制便是其中一个.如果不明白其中的奥秘,往往会出现一些让人摸不着头脑的怪现象,比如页面进入后点击按 ...
- cuda8.0 出错:/usr/bin/ld: 找不到 -lGL【转】
本文转自:https://blog.csdn.net/u010159842/article/details/56833030 最近在学习深度学习,在搭建CUDA8.0的时候,出现一个非常不好的问题: ...
- 视觉SLAM漫谈 (三): 研究点介绍
1. 前言 读者朋友们大家好!(很久很久)之前,我们为大家介绍了SLAM的基本概念和方法.相信大家对SLAM,应该有了基本的认识.在忙完一堆写论文.博士开题的事情之后,我准备回来继续填坑:为大家介绍S ...
- POJ 2391 Ombrophobic Bovines(二分+拆点+最大流)
http://poj.org/problem?id=2391 题意: 给定一个无向图,点i处有Ai头牛,点i处的牛棚能容纳Bi头牛,求一个最短时间T,使得在T时间内所有的牛都能进到某一牛棚里去. 思路 ...
- Codeforces Round #319 (Div. 2) C. Vasya and Petya's Game 数学
C. Vasya and Petya's Game time limit per test 1 second memory limit per test 256 megabytes input sta ...
- oracle RAC的客户端HA配置
在ORACLE 9i RAC 环境下,为了做到高可用性,需要对客户端的tnsnames.ora这个文件进行配置,在oracle中这样的配置叫做TAF,这个配置不能使用NETCA配置程序生成.其中ORA ...
- 使用Bootstrap插件datapicker获取时间
引入css和js <link rel="stylesheet" href="/${appName}/commons/css/datapicker/datepicke ...
- TVD$XTAT在linux下安装使用详解
扩展跟踪文件分析工具 (TVD$XTAT)是个命令行工具.和TKPROF一样,主要目的是把原始跟踪文件作为输入内容生成一个格式化的文件作为输出内容.输出文件可以是HTML或是文本文件.界面非常友好,推 ...
- URAL 1106 Two Teams (DFS)
题意 小组里有N个人,每个人都有一个或多个朋友在小组里.将小组分成两个队伍,每个队伍的任意一个成员都有至少一个朋友在另一个队伍. 思路 一开始觉得和前几天做过的一道2-sat(每个队伍任意两个成员都必 ...