记录「Failed to load module script」错误的解决方案

发表于 2022-10-18

字数统计 977

被 4039 人阅读

在本地运行良好的 VuePress 项目，部署到服务器之后侧边栏无法点击，查看浏览器的「控制台」发现了如下报错：

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.

根据报错内容大概能明白，服务器把一个应该以 application/javascript 方式返回的 JavaScript 文件，错误的以 "application/octet-stream" 的方式进行了返回。根据浏览器的规则，对于这种「货不对板」的信息被认为是危险的，所以直接就不处理了。也就是说页面中有 JavaScript 文件没有加载成功。

既然是服务器的问题又是一个纯静态的页面，那么十之八九和 Nginx 脱不了干系。首选能想到的就是 Nginx 的 JavaScript 文件 MIME 映射出现了问题。

去 Nginx 配置文件中找到 mime.types 文件。存放路径为 /www/server/nginx/conf/mime.types

打开 mime.types 文件，修改 application/javascript js; 为application/javascript js mjs;

重启 Nginx 再次打开页面，问题完美解决！