Nginx同端口部署多个vue以及unapp项目

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

22

23

24

25

26

27

"h5": {

"router": {

"mode":"hash",

"base":"./"//改为 /app/

},

// pubilcPath的路径要和H5配置中的运行基础路径一致

"publicPath":"./", //改为 /app/

"devServer": {

"disableHostCheck":true,

//禁止访问本地host文件

"port":8088,

"https":false

},

"sdkConfigs": {

"maps": {

"qqmap": {

"key":""

}

}

},

"title":"XXXXXXX",

"optimization": {

"treeShaking": {

"enable":true

}

}

}

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

server {

listen 3114 default_server;

listen [::]:3114 default_server;

server_name _;

root/mnt/menghai_ds;

location/pc/{

alias/mnt/menghai_ds/pc/;

index index.html index.htm;

}

location/app/{

alias/mnt/menghai_ds/app/;

index index.html index.htm;

}

}

1

2

3

4

5

6

7

8

9

10

11

12

13

// 项目A配置（访问路径：/projectA）

exportdefaultdefineConfig({

base: ‘/projectA/', // 关键配置：资源基础路径

plugins: [vue()],

// 其他配置…

})

// 项目B配置（访问路径：/projectB）

export default defineConfig({

base: ‘/projectB/',

plugins: [vue()],

// 其他配置…

})

1

2

3

4

5

6

7

8

9

// 两个项目均需修改路由历史模式

import { createRouter, createWebHistory } from ‘vue-router'

const router = createRouter({

history: createWebHistory(import.meta.env.BASE_URL),// 自动匹配base配置

routes: [

// 路由定义…

]

})

1

2

3

4

nginx

server {

listen 80;

server_name your-domain.com;

1

2

3

4

5

location / {

root/var/www/projectA/dist;

index index.html;

try_files $uri $uri//projectA/index.html;# 路由回退配置

}

1

2

3

4

5

location/projectB{

alias/var/www/projectB/dist;# 注意使用alias而非root

index index.html;

try_files $uri $uri//projectB/index.html;

}

1

2

3

location/projectC{ … }

}