vue+nginx 多个项目共用同个域名和端口

最新推荐文章于 2023-05-26 09:51:44 发布

qq_31494485

最新推荐文章于 2023-05-26 09:51:44 发布

阅读量2.3k

点赞数

本文链接：https://blog.csdn.net/qq_31494485/article/details/94616735

版权

本文介绍了如何使用Vue和Nginx在同一域名和端口上部署多个项目。通过修改Vue的`config/index.js`中的build配置，并调整路由的base属性，结合Nginx配置文件中的路由头匹配规则，实现了不同项目的区分访问。

摘要由CSDN通过智能技术生成

vue 配置修改config->index.js中原build为

build: {

index: path.resolve(__dirname, '../dist/index.html'),

assetsRoot: path.resolve(__dirname, '../dist'),

assetsSubDirectory: 'static',

assetsPublicPath: '/',

productionSourceMap: true,
devtool: '#source-map',

productionGzip: false,

productionGzipExtensions: ['js', 'css'],

bundleAnalyzerReport: process.env.npm_config_report

}

改为

build: {

index: path.resolve(__dirname, '../dist/index.html'),

assetsRoot: path.resolve(__dirname, '../dist'),

assetsSubDirectory: 'static',

assetsPublicPath: '/test/',     /*如果存在图片等静态资源,后面这个/必须要否则有些图片无法加载到 */

productionSourceMap: true,

devtool: '#source-map',

productionGzip: false,

productionGzipExtensions: ['js', 'css'],

bundleAnalyzerReport: process.env.npm_config_report

}

然后修改vue 路由配置base或者你的每个路由都