vue项目部署到tomcat、nginx

tomcat

根目录

// hash
// 线上环境平台输出路径
VITE_OUT_DIR = "./" // 或者 "/"

// h5
// 线上环境平台输出路径
VITE_OUT_DIR = "/"
// web.xml   web-app 标签下 刷新 404
<display-name>Router for Tomcat</display-name>
<error-page>
    <error-code>404</error-code>
    <location>/index.html</location>
</error-page>

非根目录

// hash
// 线上环境平台输出路径
VITE_OUT_DIR = "./" // 或者 "/"

// h5
// 线上环境平台输出路径
VITE_OUT_DIR = "/admin/"
// 线上环境路由历史模式
VITE_ROUTER_HISTORY = "/admin/"
// web.xml   web-app 标签下 刷新 404
<display-name>Router for Tomcat</display-name>
<error-page>
    <error-code>404</error-code>
    <location>/index.html</location>
</error-page>

nginx

根目录

// hash
// 线上环境平台输出路径
VITE_OUT_DIR = "./" // 或者 "/"

// h5
// 线上环境平台输出路径
VITE_OUT_DIR = "/"
// nginx.conf
location / {
  try_files $uri $uri/ /index.html;
}

非根目录

// hash
// 线上环境平台输出路径
VITE_OUT_DIR = "/admin/"
// 线上环境路由历史模式
VITE_ROUTER_HISTORY = "/admin/"
// 或者
VITE_OUT_DIR = "./"


// h5
// 线上环境平台输出路径
VITE_OUT_DIR = "/admin/"
// 线上环境路由历史模式
VITE_ROUTER_HISTORY = "/admin/"
// nginx.conf
location /admin/ {
  try_files $uri $uri/ /admin/index.html;
}

nginx 代理 tomcat

server {
  listen       82;
  server_name  localhost;

  # 访问nginx地址 localhost:82  代理到tomcat地址 http://localhost:1224
  location / {
    proxy_pass http://localhost:1224/; 
  }

  # 访问 nginx 地址 localhost:82/admin  代理到 tomcat 地址 http://localhost:1224/admin
  location /admin/ {
    proxy_pass http://localhost:1224/admin/; 
  }
}

  • hash: "./"
  • h5: 什么目录写什么(注意router base)
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容