Nginx 部署多个VueCli项目或者代理转发多个项目

本文主要是介绍Nginx 部署多个VueCli项目或者代理转发多个项目，对大家解决编程问题具有一定的参考价值，需要的程序猿们随着小编来一起学习吧！

vuecli 编译打包后部署到线上运行时需要服务端的配置，可以使用apache、nginx等，按照教程正常配置就能运行。

location / {
            proxy_pass http://127.0.0.1:8081/;
            proxy_http_version 1.1;
            proxy_set_header Upgrade $http_upgrade;
            proxy_set_header Connection "upgrade";
            proxy_read_timeout 3600s;
        }
        location /anan {
            try_files $uri $uri/ /index.html = 404;
            alias C:/server/dist/;
        }
        location /re/ {
            proxy_pass http://127.0.0.1:8080/;
            proxy_http_version 1.1;
            proxy_set_header Upgrade $http_upgrade;
            proxy_set_header Connection "upgrade";
            proxy_read_timeout 3600s;
        }

这里部署了3个项目，当访问http://localhost的域名时，进入第一个项目，访问域名http://localhost/anan/**时，进入第二个项目，访问http://localhost/re/**时，进入第三个项目。

module.exports = defineConfig({
    
    publicPath:/re/,
)}

表示当前项目的所有路由和js访问的路径之前都会自动加入/re/**开头。这样当访问http://127.0.0.1:8080/re/index时，就能正常访问。

这篇关于Nginx 部署多个VueCli项目或者代理转发多个项目的文章就介绍到这儿，希望我们推荐的文章对大家有所帮助，也希望大家多多支持为之网！