Nginx——一个域名下部署多个Vue项目

 publicPath: process.env.NODE_ENV === 'production' ? '/screen/' : '/',

const { defineConfig } = require('@vue/cli-service');
const path = require('path');
const resolve = (dir) => {
    return path.join(__dirname, dir);
};
module.exports = defineConfig({
    transpileDependencies: true,
    publicPath: process.env.NODE_ENV === 'production' ? '/screen/' : '/',
    filenameHashing: true,
    productionSourceMap: false,
    chainWebpack: (config) => {
        config.resolve.alias.set('@', resolve('src'));
        config.plugin('html').tap((args) => {
            args[0].title = 'xxx营销一体化数字管理平台';
            return args;
        });
    },
});

import Vue from 'vue';
import VueRouter from 'vue-router';

Vue.use(VueRouter);

const routes = [
    {
        path: '/',
        name: 'index',
        component: () => import('@/views/index.vue'),
    },
];
const router = new VueRouter({
    mode: 'history',
    base: 'screen', // 基础路径进行调整
    routes,
});

export default router;

$ cd <第一个项目目录下>
$ mkdir screen

 location ^~ /screen {
               alias  /www/wwwroot/tiktok-web/screen/dist;
               try_files $uri $uri/ /screen/index.html;
        }

$ nginx -t
$ nginx -s reload