一个域名对应多个vue.js工程的nginx配置

需求

    http://wan.www.cn/aaaaa
    http://wan.www.cn/sc

类似这种多个前端vue工程，对应同一个域名

nginx配置

server {
		listen 80;
		server_name wan.www.cn;
		#access_log  logs/nnnnnnnnnnnnn.log  main;
		root D:/pc/dist/ssb; 
		index index.php index.html index.htm;
		
		location /aaaaa {
			try_files $uri $uri/ /aaaaa/index.html;
		}
		location /ssb {#aaaaa对应的服务器
			proxy_pass http://localhost:8080/ssb; 
			proxy_set_header Host $host;
		}
		
		location /sc {
			try_files $uri $uri/ /sc/index.html;
		}
		location /admin {#sc对应的服务器
			proxy_pass http://localhost:8087/admin; 
			proxy_set_header Host $host;
		}
	}

sc工程

需要修改assetsPublicPath路径

module.exports = {
  build: {
    env: require('./prod.env'),
    index: path.resolve(__dirname, '../dist/index.html'),
    assetsRoot: path.resolve(__dirname, '../dist'),
    assetsSubDirectory: 'static',
    assetsPublicPath: '/sc/',
    productionSourceMap: true,
    // Gzip off by default as many popular static hosts such as
    // Surge or Netlify already gzip all static assets for you.
    // Before setting to `true`, make sure to:
    // npm install --save-dev compression-webpack-plugin
    productionGzip: false,
    productionGzipExtensions: ['js', 'css'],
    // Run the build command with an extra argument to
    // View the bundle analyzer report after build finishes:
    // `npm run build --report`
    // Set to `true` or `false` to always turn it on or off
    bundleAnalyzerReport: process.env.npm_config_report
  },

rounter目录下的index.js添加base到目录下

const router = new Router({
	mode: 'history',
	base: '/sc/',
        scrollBehavior,
        routes: [{
          path: '/',
          name: 'index',
          component: index
        },

前端打包后放到nginx配置的root目录下

aaaaa工程也是如同sc工程一样的配置

注意

在本地测试，windows环境下还需要配置一下hosts文件

	127.0.0.1  wan.www.cn
	127.0.0.1  wan.aaa.cn

启动好nginx后，在浏览器中输入上面需求中的地址即可访问了