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)部署在子目录或者二级目录实践的更多相关文章

  1. vue history 模式打包部署在域名的二级目录的配置指南

    最近在做项目,需要把项目部署在域名下的二级目录,并且是在用vue-router的history 模式. 我们都知道vue-router 的两种前端基本访问模式 hash 和history .hash ...

  2. vue+uwsgi+nginx部署路飞学城

    vue+uwsgi+nginx部署路飞学城   有一天,老男孩的苑日天给我发来了两个神秘代码,听说是和mjj的结晶 超哥将这两个代码,放到了一个网站上,大家可以自行下载 路飞学城django代码 ht ...

  3. linux vue uwsgi nginx 部署路飞学城 安装 vue

    vue+uwsgi+nginx部署路飞学城 有一天,老男孩的苑日天给我发来了两个神秘代码,听说是和mjj的结晶 超哥将这两个代码,放到了一个网站上,大家可以自行下载 路飞学城django代码#这个代码 ...

  4. Vue 之 Nginx 部署

    nginx 下载地址:http://nginx.org/en/download.html 下载后直接解压,cmd 进入到解压目录运行 start nginx 即可启动 常用命令: nginx -s s ...

  5. Nginx 前端项目配置 包含二级目录和接口代理

    Nginx是目前用的比较多的一个前端服务器 其优点是配置简单修改一下server就能用 并发性能比较好,具体怎么好就看这个吧 开撸 1.找到nginx (liunx系统,已安装) whereis ng ...

  6. 修改vue的配置项支持生产环境下二级目录访问的方法

    本文主要记录如何配置vue的打包文件配置项,使打包后的文件可以支持二级目录的访问. 1.常规打包 在实际的项目中,我们通常都使用 npm run build 直接打包文件后丢到服务器上访问 打包后的文 ...

  7. vue+uwsgi+nginx部署luffty项目

    在部署项目之前本人已经将前端代码和后端代码发布在了一个网站上,大家可自行下载,当然如果有Xftp工具也可以直接从本地导入. django代码 https://files.cnblogs.com/fil ...

  8. vue+uwsgi+nginx部署前后端分离项目

    前后端分离,vue前端提供静态页面,且可以向后台发起get,post等restful请求. django后台提供数据支撑,返回json数据,返回给vue,进行数据页面渲染 后端 创建虚拟环境 解决dj ...

  9. vue+uwsgi+nginx部署项目

    首先先下载好前后端项目 先从前端vue搞起 要在服务器上,编译打包vue项目,必须得有node环境 下载node二进制包,此包已经包含node,不需要再编译 wget https://nodejs.o ...

随机推荐

  1. maven和gradle中,dependency和plugin的区别

    dependency引入的东西 作用:代码编译/运行时所需要的东西 打包:项目打包后这些东西基本都在(一般都在). 例如:JSON工具包GSON(com.google.code.gson),不仅开发时 ...

  2. 20145104张家明 《Java程序设计》第5周学习总结

    20145104张家明 <Java程序设计>第5周学习总结 教材学习内容总结 第八章(概括为一下内容) 1.如果父类异常对象在子类异常前被捕捉,则catch子类异常对象的区块将永远不会被执 ...

  3. 20135320赵瀚青LINUX第八周学习笔记

    赵瀚青原创作品转载请注明出处<Linux内核分析>MOOC课程http://mooc.study.163.com/course/USTC-1000029000 概述 本周学习的是linux ...

  4. Cooperation.GTST团队第二周项目总结

    项目进展 这周我们把工作主要放在了UI界面的实现上,为了让整款APP看上去能够更加高大上,我们决定采用Android 5.0开始推出的一个Material Design风格的导航控件Toolbar. ...

  5. 如何运行.ipynb文件

    首先cmd下面输入: pip install jupyter notebook ,安装慢的改下pip的源为国内的源 然后cmd中输入: jupyter notebook就会弹出一个页面 先upload ...

  6. Java序列化(Serialization)

    关于Java的序列化的文章在网上已经够多了,在这里写关于Java序列化的文章是对自己关于这方面的的一种总结,结合以前的开发经验与网上的资料,写了这篇文章,对自己是有着巩固记忆的作用,也希望能够对大家有 ...

  7. HDU 3374 String Problem(最大最小表示+KMP)题解

    题意:给你一个字符串,这个字符串可以这样操作:把第一个字符放到最后一个形成一个新的字符串,记原式Rank为1,每操作一步Rank+1,问你这样操作得出的最小字典序的字符串的Rank和这样的字符串有几个 ...

  8. Codeforces Round #390 (Div. 2) D. Fedor and coupons(区间最大交集+优先队列)

    http://codeforces.com/contest/754/problem/D 题意: 给定几组区间,找k组区间,使得它们的公共交集最大. 思路: 在k组区间中,它们的公共交集=k组区间中右端 ...

  9. 51Nod 1557 两个集合(二分)

    http://www.51nod.com/onlineJudge/questionCode.html#!problemId=1557 题意: 小X有n个互不相同的整数: p1,p2,...,pn .他 ...

  10. Spring中的@Transactional

    spring中的@Transactional基于动态代理的机制,提供了一种透明的事务管理机制,方便快捷解决在开发中碰到的问题. 一般使用是通过如下代码对方法或接口或类注释: @Transactiona ...