nginx+vite 项目打包及部署(添加二级路由发生的错误)

最新推荐文章于 2024-05-20 00:46:48 发布

通域

最新推荐文章于 2024-05-20 00:46:48 发布

阅读量539

点赞数 1

分类专栏： linux nginx node 文章标签： nginx 服务器前端

本文链接：https://blog.csdn.net/xiaomzhng/article/details/132384992

版权

linux 同时被 3 个专栏收录

25 篇文章 1 订阅

订阅专栏

node

4 篇文章 0 订阅

订阅专栏

nginx

2 篇文章 0 订阅

订阅专栏

错误信息

_app.config.js:1  Uncaught SyntaxError: Unexpected token '<'
daas/assets/index.edf40865.js:1  Failed to load module script: Expected a JavaScript module script but the server responded with a MIME type of "text/html". Strict MIME type checking is enforced for module scripts per HTML spec.

原因

由于nginx 配置错误所导致的二级路径无法解析

.env.production(生产环境配置文件)

# 基础路径
VITE_PUBLIC_PATH = /demo

vite.config.ts


export default ({ mode }: ConfigEnv): UserConfig => {
  // 获取 .env 环境配置文件
  const env = loadEnv(mode, process.cwd());
  return {
    // 基础路径 
    base: env.VITE_BASE_PATH,
    ...
  }
}

nginx 配置

upstream 3.com {
  server 127.0.0.1:81;
 }
server {
    listen       3000;
    server_name  3.com;
    # 监听demo路径
    location /demo {
    #指向资源的路径,alias为当前index.html的目录,在处理二级路由时,应当使用alias,而不是使用root
	alias /opt/d/demo;
	index index.html;
         # /demo/index.html; 这里需要添加 /demo,而不能直接写/index.html;
		 try_files $uri $uri/ /demo/index.html;
    }
	
    error_page   500 502 503 504  /50x.html;
    location = /50x.html {
        root   html;
    }

}