需求
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后,在浏览器中输入上面需求中的地址即可访问了