vuel路由间通讯_vue 同ip不同路由地址配置

1、静态资源地址配置

这里要分vuecli2和vuecli3两种环境，只讲vuecli3的，与vuecli2不同的地方我提下位置你就可以自己找了。

在vue.config.js文件下找到publicPath配置，添加如下配置(vuecli2就是config文件夹下的assetsPublicPath配置)

process.env.NODE_ENV==='production'?'/newProject/':'/',

1

这个配置在官方文档上有说明，就是要注意区分开发环境与生产部署环境。生产环境上我们跑起项目时是不需要在url上加上这个newProject的，加上这个，是因为后面部署的时候nginx会根据这个来区分不同的项目。

2、在模板文件下添加base

在部署环境下， a、img、link、form这些标签要找到对应资源，也要先匹配nginx环境，所以要在head节点下加上base配置。

base标签为页面上的所有链接规定默认地址或默认目标。

打包之后，你的html页面看起来就是这样：

3、将’/newProject/'应用到vue项目路由中

这一步就是将vue项目中的页面路由切换加上这个添加的url路径，在router的初始化步骤下添加：

const router = new VueRouter({

mode:'history',base:process.env.NODE_ENV==='production'?'/newProject/index/':'/index/',routes

<