Nginx配置多个vue静态网站方式
参考资源:Vue 打包后静态资源加前缀,页面路由加前缀,修改静态资源访问路径
1.具体需求:
一个端口下,需要配置多个静态站点,用不同的路径区分。比如:localhost:9001/adminA,就访问A系统;localhost:9001/adminB,就访问B系统.
2.项目背景:
1)Nginx代理
2)静态资源是用vue打包的。
3.具体操作:
1)vue设置静态资源(css、js)的路径前缀。这个需要根据不同的vue-cli版本,进行不同的设置。原因是默认打包后,css和js的url路径,是不包含我们用来区分不同静态站点的路径前缀的,需要配置一下。
vue-cli版本:3.0
静态资源前缀:
vue.config.js 中: module.exports ={ publicPath:”/前缀" , …...}
2)nginx配置:
server { listen 9002; server_name localhost; location / { root "H:\code\ceshi\serverweb"; index index.html; } location /test2 { alias "H:\code\ceshi\submitweb"; index index.html; } }
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 记一次.NET内存居高不下排查解决与启示
· 探究高空视频全景AR技术的实现原理
· 理解Rust引用及其生命周期标识(上)
· 浏览器原生「磁吸」效果!Anchor Positioning 锚点定位神器解析
· 没有源码,如何修改代码逻辑?
· 全程不用写代码,我用AI程序员写了一个飞机大战
· DeepSeek 开源周回顾「GitHub 热点速览」
· 记一次.NET内存居高不下排查解决与启示
· MongoDB 8.0这个新功能碉堡了,比商业数据库还牛
· .NET10 - 预览版1新功能体验(一)