前端项目发布到Nginx里报Failed to load module script错误

于 2024-08-05 18:40:07 发布
阅读量137 收藏 1
点赞数 6
文章标签： 服务器 前端 javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/cg_ssh/article/details/140933790
版权

错误信息：

Failed to load module script: Expected a JavaScript module script but the server responded with a MIME type of "application/octet-stream". Strict MIME type checking is enforced for module scripts per HTML spec.

报错原因：

我在项目里使用了 mjs 文件，而ngnix无法识别该类型的文件

      <script type="module" src="../build/pdf.mjs"></script>
      <link rel="stylesheet" href="viewer.css" />
      <script type="module" src="viewer.mjs"></script>

处理方式：

1.在服务器nginx目录 找到conf/mime.types 文件找到 application/javascript 项并添加mjs类型

2.确保nginx.conf里http 里include 了该文件 

 

3.然后执行命令重新载入配置文件或直接重启服务

nginx -s reload

终极踩坑:

按照以上步骤然、并、卵，你猜怎么着：

浏览器缓存搞了我一个小时，想放弃的时候才突然想到会不会是缓存问题........勾上它 F5

起飞~~~~~~~~~~~~~~~~~~ 

cg_ssh
关注
  • 6
    点赞
  • 踩
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
uniapp - 报错 Failed to load module script: Expected a JavaScript module script but the serve with a M
高级前端工程师
05-07 3631
uni-app，报错，小程序，h5，网页网站，uniapp h5平台，H5端，浏览器报错，样式都乱了，图标大小不一致，样式乱套了，css样式不正常，页面乱了，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 scri
使用nginx部署前端项目（超详细教程）.pdf
04-29
【使用Nginx部署前端项目】的教程是一个详尽的指南，主要面向初学者，旨在教会读者如何利用Nginx高效地部署前端应用。Nginx是一个高性能的Web服务器和反向代理，因其高并发处理能力和低内存占用而受到广泛青睐。 ...
Vue3+vite打包发版项目报错简记：Failed to load module script
kevin_gwc的博客
08-24 2万+
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
关于前端报 Failed to load module script: Expected a JavaScript module script but the server responded wi
m0_53825119的博客
11-09 3167
关于前端 报 Failed to load module script: Expected a JavaScript module script but the server responded wi
前端发布部署报错“Failed to load module script: Expected a JavaScript module script but the server responded”
郭蕾蕾 努力的包子
08-15 2万+
Failed to load module script: Expected a JavaScript module script but the server responded
【问题解决】Failed to load module script: Expected a JavaScript module script but the server respond
热门推荐
qq_17335549的博客
11-19 3万+
xxx.86eb4fa7.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.
Vue3+vite打包发版项目报错简记：Failed to load module script_vue3 failed to load module script expected a java
2401_84435739的博客
05-16 525
这个错误提示的意思是：网页中使用了模块脚本（module script），但服务器返回的 MIME 类型是 “text/html”，而不是 JavaScript 类型。经过对项目的分析，基本排除了以上两种问题的可能。项目里用到了react，为什么要选择react，react有哪些好处。有了解过react的虚拟DOM吗，虚拟DOM是怎么对比的呢。react生命周期函数和react组件的生命周期。react和Vue的原理，区别，亮点，作用。react的组件是通过什么去判断是否刷新的。react的生命周期函数。
Failed to load module script: Expected a JavaScript module script but the server responded with a MI
weixin_43267158的博客
03-08 1478
vue中使用iframe嵌套第三方页面，打卡页面为空白。打开控制台发现发现js文件的响应类型也为text/plain。在iframe嵌套页面里面前端框架为vue3+vite，通过初步判断为资源拉取问题。
使用pdfjs报错：Failed to load module script: Expected a JavaScript module script but the server responded
啃编程
03-16 4635
MIME 类型设置不正确： 服务器返回的文件 MIME 类型不正确。浏览器期望模块脚本的 MIME 类型为 application/javascript。如果服务器返回的 MIME 类型不是这个，浏览器会拒绝加载它，并显示这个错误。
Failed to load module script: Expected a JavaScript module scriptbut the server responded
m0_64998696的博客
08-25 9541
首先将你原本的镜像在打包的地方尽数删除，将基础镜像也删除，将docker中的none镜像也删除，再使用docker system prune 选择y，然后再对代码进行编译、打镜像，这个错误就不攻自破。当遇见这样的错误有且只有这一个报错时，首先保证代码没有问题，我这里就是代码保证是没有问题的，将源码编译后打成镜像时发生的这种错误，这种就不是所有人的问题，是docker的一个缓存问题。只有这一个错误，在网上搜了两天也没搜到答案，全是修改nginx和base的，我这里可以保证nginx和base没有问题。
尚硅谷《尚品甄选》项目前端部署到nginx服务
03-28
在这个场景下，"尚硅谷《尚品甄选》项目前端部署到nginx服务"是一个典型的实践，涉及到了前端开发与服务器配置的关键技术。Nginx是一款高性能、轻量级的Web服务器和反向代理服务器，常用于部署和管理前端应用。 ...
尚硅谷《尚品甄选》用户端的前端工程项目部署到nginx服务
04-07
本项目涉及的是尚硅谷《尚品甄选》用户端的前端工程，该工程被部署到Nginx服务器上，使用默认端口911进行通信。接下来，我们将深入探讨相关知识点。 首先，Nginx是一个高性能的Web服务器和反向代理服务器，常用于...
vue前端项目部署之nginx配置.md
03-20
### Vue前端项目部署之Nginx配置详解 #### 一、引言 随着前端技术的发展，Vue.js作为一款流行的前端框架被广泛应用于Web应用开发之中。对于开发者来说，如何将开发完成的应用部署到生产环境是必不可少的一环。本文...
web服务器nginx+部署前端vue项目
03-22
### Nginx 与前端 Vue 项目的部署 #### 一、Nginx 概述 Nginx 是一款广泛使用的高性能 HTTP 和反向代理 web 服务器。它以其出色的并发处理能力和较低的内存消耗而闻名。根据相关报告，Nginx 能够支持高达 50,000 ...
Openwrt配置ZeroTier，实现公网访问内网中服务器
最新发布
低温热源的博客
08-05 360
​ZeroTier注册&Openwrt初始配置 首先来到Openwrt的VPN→ZeroTier页面，进行一个很简单的注册 注册后去zerotier的网页管理页面进行一个很简单的创建网络 复制网络ID备用 在openwrt填写网络ID并启用。如果你需要访问内网主机勾上 自动客户端NAT 在zerotier网络管理界面授权通过openwrt上的zerotier。 路由创建 初始化启动后可以在openwrt看到zerotier给你分配的IP，记下（授权有延迟，因此接口信息可能滞后显示。 防火墙设置
动态加载第三方库——dlopen
qq_43587345的博客
08-02 338
dlopen是一个 POSIX 标准的函数，用于在程序运行时动态加载共享库（动态库）并返回一个句柄，以便后续对库中函数的调用。在 C 语言中，使用dlopen函数可以实现动态加载和调用动态库中的函数，这在插件系统或者需要动态加载库的情况下非常有用。
Linux手动编译方式安装httpd及配置系统服务（含不同安装方式简介）
shyuu的博客
08-04 743
Linux手动编译方式安装httpd及配置系统服务。包括几种软件安装方式的优缺点。手动编译安装方式相较其他方式有灵活性高、版本控制自由、依赖管理可控的优点等。
linux nginx前端项目部署到home目录下访问报403错误
05-24
可能是因为Nginx没有读取到您home目录下的文件权限。您可以尝试以下步骤： 1. 确认您home目录下的网站文件的权限是否正确，可以使用以下命令： ``` ls -l /home/your_username/your_website_folder/ ``` 确认文件所有者是否为当前用户，文件权限是否为755或777。 2. 修改Nginx配置文件，将文件夹的所有者更改为Nginx用户，例如www-data。您可以在Nginx配置文件中添加以下行： ``` sudo nano /etc/nginx/nginx.conf ``` ``` user www-data; worker_processes auto; pid /run/nginx.pid; ``` 3. 在Nginx配置文件中添加以下内容： ``` server { listen 80; server_name your_domain.com; root /home/your_username/your_website_folder; index index.html index.htm; location / { try_files $uri $uri/ =404; } } ``` 注意：将“your_domain.com”替换为您的域名，“your_username”和“your_website_folder”替换为您的用户名和网站文件夹。 4. 重启Nginx服务： ``` sudo service nginx restart ``` 然后您应该能够访问您的网站了。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值