vue项目打包上线时报错‘Failed to load resource: net::ERR_FILE_NOT_FOUND‘

最新推荐文章于 2024-02-18 00:21:33 发布
原创 最新推荐文章于 2024-02-18 00:21:33 发布 · 3.2k 阅读 · 4 ·
CC 4.0 BY-SA版权
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
文章标签：

#vue.js #前端 #javascript

当Vue项目打包上线遇到'Failed to load resource: net::ERR_FILE_NOT_FOUND'错误时，通常是由于css和js文件路径问题导致。解决方法是在vue.config.js中设置publicPath为'./'，然后重新打包即可修复此问题。

问题描述

vue项目打包上线时报错’Failed to load resource: net::ERR_FILE_NOT_FOUND’，如下图所示：
在这里插入图片描述

原因分析及解决方案：

这里的确是css以及js文件的路径问题，但解决时并不需要手动改路径或者加一段判断去修改，最方便的办法时在项目打包前的vue.config.js里面将publicPath属性添加或者修改为 publicPath: ‘./’， 然后重新打包。

CS_ruler
关注
uniapp - H5网页打包运行报错Failed to load resource: net::ERR_FILE_NOT_FOUND（uniApp打包成H5部署到服务器，打包h5白屏并报错页面空白）
🏆 前端领域优质创作者
10-28 3121
Failed to load resource: net::ERR_FILE_NOT_FOUND，uniapp 坑之打包之后白屏，uniapp打包h5，HBuilderX 打包H5后空白报错 Failed to load resource: net::ERR FILE NOT_FOUND，UNI-APP H5应用白屏（空白页）解决方案，白屏并报错Failed to load resource: net::ERR_FILE_NOT_FOUND，uniapp开发，打包成H5部署到服务器，uniapp打包之后首页
vue打包：Failed to load resource: net::ERR_FILE_NOT_FOUND问题
zxw939832359的博客
12-28 5994
vue项目npm run build 打包会出现： Failed to load resource: net::ERR_FILE_NOT_FOUND 总结解决办法： config/index.js里将assetsPublicPath:’/‘改成assetsPublicPath:’./' assetsRoot: path.resolve(__dirname, '../dist'), assetsSubDirectory: 'static', assetsPublicPath:
成功解决：Failed to load resource: net::ERR_FILE_NOT_FOUND
热门推荐
日常笔记 | 干货分享 | 毕设源码 | 毕设指导 | 答辩指导
08-29 14万+
在vscode中使用插件NPM脚本进行打包项目操作、然后运行打包后的项目、没有效果。
spring-boot+vue项目使用 electron打包exe桌面项目，桌面端出现报错Failed to load resource: net::ERR_FILE_NOT_FOUND（解决）
阿丹的博客
07-07 3091
阿丹：因为之前使用百度网盘开放平台进行开发，发现百度网盘只支持在桌面应用的开发上传，所以在使用electron打包vue之后运行出现这个问题如果要看到这个报错信息那么需要先打开控制台，可以先参考这个文章。
vue axios 跨域 请求代理
abelrox的博客
11-20 390
1. vue.config.js的配置 module.exports = { publicPath: './', devServer: { // axios 跨域代理 proxy: { '/api': { target: 'http://192.168.10.129:5000', changeOrigin: true } }
vue 打包背景图片不显示问题，出现Failed to load resource: net::ERR_FILE_NOT_FOUND，解决
敲门的小白
11-14 3634
if (options.extract) { return ExtractTextPlugin.extract({ use: loaders, fallback: ‘vue-style-loader’, publicPath: ‘…/…/’ //背景图片位置 }) } else { return [‘vue-style-loader’].concat(loaders) } ...
【vue-cli踩坑】Failed to load resource: net::ERR_FILE_NOT_FOUND或者build之后dist文件下的index.html不显示内容
艾欢欢的博客
04-23 9164
通过vue-cli创建的项目 npm run dev 运行开发环境可以看到效果， 但是 npm run dbulid 之后，通过产生的dist文件下的index.html直接打开没显示，看不到效果，报错如下： 知乎上：webpack.prod.conf.js 中output添加参数publicPath:’./’ 具体代码： 在webpack.base.conf.js里 output: { ...
静态项目打包报错：Failed to load resource: net::ERR_FILE_NOT_FOUND
最新发布
06-18
下面生成相关问题：针对静态项目打包后出现 `Failed to load resource net::ERR_FILE_NOT_FOUND` 错误，以下是系统性的解决方案： ### 问题原因分析 该错误表示打包后的 HTML 文件无法正确加载 JS/CSS/图片等静态...
Vue 打包后打开为空白页面 并且控制台报错‘Failed to load resource: net::ERR_FILE_NOT_FOUND’
官方推荐
05-12 5973
当我们开发完成后进行 npm run build打包后形成dist文件 我们通过访问dist文件中的index，会出现空白页面什么都不显示的问题，控制台中还会报‘Failed to load resource: net::ERR_FILE_NOT_FOUND’错误，其实是因为打包后的dist目录下的文件引用路径不对，会因找不到文件而报错导致白屏，cli2.0和cli3.0解决办法不同，解决办法如下： Vue cli2版本解决办法 找到我们的 config文件夹下面的 index.js 配置文件 找..
Vue项目打包报错Failed to load resource: net::ERR_FILE_NOT_FOUND
敲门的小白
11-04 3万+
打包出错显示空白页，或者Failed to load resource: net::ERR_FILE_NOT_FOUND 1.webpack.prod.conf.js 中output添加参数publicPath:'./' 2.修改webpack.base.conf.js中： publicPath: process.env.NODE_ENV === 'production' ?'....
vue 项目打包报错 Failed to load resource: net::ERR_FILE_NOT_FOUND
c327127960的博客
11-15 1769
vue 项目打包报错 Failed to load resource: net::ERR_FILE_NOT_FOUND
Failed to load resource: net::ERR_FILE_NOT_FOUND
weixin_51339619的博客
09-15 685
vue打包页面空白错误解决
“Failed to load resource: net::ERR_FILE_NOT_FOUND“错误 。vue-cli 3.0 创建的项目，dev下能运行，打包后报错，页面空白 。
小猪的博客
10-15 1万+
cli3.0 解决办法： Failed to load resource: net::ERR_FILE_NOT_FOUND 打开dist/index.html， 引入是有问题的， 在vue-cli 3.0 创建的项目中是找不到webpack的配置文件，因为vue-cli 3.0 将其封装起来了，只需要在项目的根目录下的vue.config.js文件中修改就行了（若项目没有...
Failed to load resource: net::ERR_FILE_NOT_FOUND或者vue dist文件下的index.html没显示
u013365404的专栏
12-28 2万+
vue-cli  npm run dev 可以看到，但是通过dist文件下的index.html直接打开没显示，没看到   知乎上：webpack.prod.conf.js 中output添加参数publicPath:'./' 具体： publicPath: process.env.NODE_ENV === 'production'       ? './' + config.build
Failed to load resource: net::ERR_FILE_NOT_FOUND问题解决
sensendedede的博客
02-18 1万+
文件中，静态资源的引用路径将是相对于当前路径的，而不是绝对路径。的效果就是让构建后的资源使用相对路径引用，而不是绝对路径。默认情况下，Vue CLI 生成的项目会把所有静态资源引用路径设置为绝对路径，即。的设置，构建后的资源引用路径已经是相对路径了，所以你不需要手动改变。是告诉 webpack 打包后的文件在浏览器中的访问路径。这适用于大多数情况，尤其是当你的项目部署在服务器的根目录时。文件中的引用路径，这由 webpack 自动处理了。时，实际上是将构建后的资源相对于当前路径进行引用。
评论 2
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
红包 添加红包
表情包 插入表情
表情包 代码片
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值