vue配置二级目录以及nginx多网站部署

辰漪
2021-12-17 / 0 评论 / 701 阅读 / 正在检测是否收录...

1. 在vue.config.js配置publicPath二级目录

module.exports = {
  publicPath: '/adm/',  // 二级目录名称
}

2. 在router中配置base

const router = new VueRouter({
  mode: 'history',
  // base: process.env.BASE_URL,
  base: '/adm/',  // 二级目录
  routes
})

3. nginx多网站配置 根据location部署

// 在nginx.conf文件中配置
    server {
        listen       80;
        server_name  localhost;
        location / {  //  前台网站  访问 127.0.0.1
            root   dist;  // 根目录下直接放了一个dist前端代码
            index  index.html index.htm;
            try_files $uri $uri/ /index.html; // 刷新空白
        }
        location /adm { // 后台网站  访问  127.0.0.1/adm
            alias   adm/dist; // 根目录下adm文件夹下有一个dist前端代码
            index  index.html index.htm;
            try_files $uri $uri/ /index.html;
        }
    }

注意:nginx配置二级目录要使用alias不能使用root
前台测试地址: https://cyblog.wrz521.top
后台测试地址:https://cyblog.wrz521.top/adm

3
选择打赏方式:
微信

评论 (0)

取消