基于webpack模板的vue项目打包后遇到的问题1（Failed to load resource: net::ERR_FILE_NOT_FOUND）

最新推荐文章于 2024-02-19 23:30:15 发布
最新推荐文章于 2024-02-19 23:30:15 发布
阅读量4.9w 收藏 20
点赞数 6
分类专栏： 问题记录总结 文章标签： vue.js webpack
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/mangxi8200/article/details/81004966
版权

npm run build 之后在本地打开html页面出现个问题，如图：
这里写图片描述

网上查找了解决方法，将config文件夹里面的index.js中的assetsPublicPath的值修改 为“./”，问题解决。：
这里写图片描述

补充：
webpack.prod.conf.js 中output添加参数publicPath:’./’
在webpack.base.conf.js里
publicPath: process.env.NODE_ENV === ‘production’
? ‘./’ +config.build.assetsPublicPath
: ‘./’ + config.dev.assetsPublicPath

mangxi8200
关注
  • 6
    点赞
  • 踩
  • 20
    收藏
    觉得还不错? 一键收藏
  • 6
    评论
专栏目录
webpack_vue_template:webpack + vue =项目模板
05-09
Webapck4 + Vue模板 开发命令行 # serve with hot reload at localhost:3000 npm run start 生产命令行 # build for production with minification npm run build 其他命令行 # stroybook http://localhost:9001 npm run storybook
vue3：项目打包后，浏览器打开页面报错： Failed to load resource: net::ERR_FILE_NOT_FOUN （路径错误）
LiliGong1的博客
06-25 1557
路径错误
搭建k8s集群所遇到的坑
最新发布
weixin_65985924的博客
02-19 670
原因是网络插件未安装，下载 kube-flannel.yml或者calico.yaml文件，并执行kubectl apply -f calico.yaml或者执行kubectl apply -f kube-flannel.yml。如果报错i存在多个 CRI 的终端，同理命令最后加上参数–cri-socket=unix:///var/run/cri-dockerd.sock（换成你实际使用的终端）查看10259端口哪个服务在用，发现是是kube-apiserver这个服务占用了这个端口，于是执行。
解决vue net :ERR_CONNECTION_REFUSED报错问题
11-20
我是因为频繁的更换网络，导致这样的。 然后我回忆了一下。之前每次改ip都会把Package.json 中的 –host 0.0.0.0改成我的固定ip，由于改来改去太麻烦了，我就设置为0.0.0.0 所以喜提上图的一排get请求 “dev”: “webpack-dev-server –inline –progress –config build/webpack.dev.conf.js –host 0.0.0.0”, 解决办法 把 –host 0.0.0.0 改成你的固定ip 补充知识：Vue不能检测数组下标赋值、长度变化、对象属性动态添加和删除的原因和解决办法 解决方法： 1、方案一
webpack5-vue3::party_popper: 基于 webpack5+vue3 搭建的前端H5模板
08-04
文章介绍 demo地址: yarn install yarn dev 800多道面试题小程序
在react项目中使用webpack打包后点击index.html页面控制台提示Failed to load resource: net::ERR_FILE_NOT_FOUND的解决方法
weixin_39893889的博客
10-09 5214
在react项目中使用webpack打包后点击index.html页面控制台提示Failed to load resource: net::ERR_FILE_NOT_FOUND的解决方法 方法一：在package.json文件中进行如下修改 "homepage":"./" { "name": "cnode", "version": "1.0.0", "description": ""...
Failed to load resource: net::ERR_FILE_NOT_FOUND
weixin_51339619的博客
09-15 386
vue打包页面空白错误解决
VueCli3项目解决打包问题
袁的博客
10-04 1047
VueCli3项目解决打包问题，主要解决打包后页面资源无法访问，配置了devServe，访问无法访问后端！！
vue项目打包上线时报错‘Failed to load resource: net::ERR_FILE_NOT_FOUND‘
快乐de馒头
07-30 4569
这里的确是css以及js文件的路径问题，但解决时并不需要手动改路径或者加一段判断去修改，最方便的办法时在项目打包前的vue.config.js里面将publicPath属性添加或者修改为publicPath‘./’，然后重新打包。版权声明本文为CSDN博主「CS_ruler」的原创文章，遵循CC4.0BY-SA版权协议，转载请附上原文出处链接及本声明。原文链接https//blog.csdn.net/CS_ruler/article/details/125479780。...
做Vue项目的bug
m0_49416118的博客
07-13 430
报错：‘npm’ 不是内部或外部命令，也不是可运行的程序 或批处理文件。 解决方法：确保下载node.js以后给电脑和webstorm分别配置坏境。 ‘vue-cli-service’ 不是内部或外部命令，也不是可运行的程序 或批处理文件。 解决方法： 更新node.js版本：npm i -g n --force ...
vue加载本地资源报错：GET http://assets/ambulance.glb net::ERR_NAME_NOT_RESOLVED
FlyToTheWorld的博客
03-30 1923
解决办法 将资源部署到tomcat中，通过链接访问 新建文件夹存放需要部署的资源 修改配置文件 <Context path="/model" docBase="E:\work_software\apache-tomcat-9.0.36\webapps\model" debug="0" reloadable="true"/> vue页面中引用 ...
解决在vue项目中webpack打包后字体不生效的问题
10-18
今天小编就为大家分享一篇解决在vue项目中webpack打包后字体不生效的问题，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
webpack-vue:基于webpack4+ babel7+搭建的前端打包配置环境
04-28
webpack-vue基于webpack5+ babel7+搭建的前端打包配置环境构建命令npm install npm run devnpm run buildwebpack官方网址 https://webpack.js.org https://webpack.docschina.org从零开始配置webapck打包环境设置...
Vue 打包后打开为空白页面 并且控制台报错‘Failed to load resource: net::ERR_FILE_NOT_FOUND’
官方推荐
05-12 4573
当我们开发完成后进行 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 配置文件 找..
成功解决：Failed to load resource: net::ERR_FILE_NOT_FOUND
热门推荐
做笔记\记录遇到的程序bug
08-29 12万+
在vscode中使用插件NPM脚本进行打包项目操作、然后运行打包后的项目、没有效果。
vue-cli脚手架创建创建的项目打包后无法正常打开报 Failed to load resource: net::ERR_FILE_NOT_FOUND错误
LLL3189860667的博客
07-24 494
亲爱的小伙伴们，你们最近是否有遇到用使用最新的脚手架打包项目后index.html文件无法正常打开，然后控制台报错的情况呢，不要担心，这个坑今天被我踩到了并且被我解决了，下边就让我来给大家分享一下经验吧！2.找到router.js文件，将history模式关闭。1.找到vue.config.js文件，进行如下配置。即添加一行配置：pubilcPath:'./'
vue使用webpack打包生产时出现的错误和解决方法
u012967454的博客
01-31 1582
1.Failed to load resource: net::ERR_FILE_NOT_FOUND或者vue dist文件下的index.html没显示 （解决 ：考虑路径问题，在配置webpack ，output属性时设置所有路径添加./（publicPath:’./’）使得项目能进入到其所在的相对路径上 ./表示当前路劲下 从而通过这种形式修改添加publicPath解决vue项目生成文件时...
如何解决Chrome浏览器err_name_not_resolved问题
Sensation_cyq的博客
04-16 5487
如何解决Chrome浏览器err_name_not_resolved问题
vue跨域问题
Tel_17674647975的博客
03-21 175
vue跨域问题（内含代码）。
vue 打包后IMG 引用失败Failed to load resource: net::ERR_FILE_NOT_FOUND
11-09
在Vue打包后，如果图片引用失败，通常是由于打包后的文件路径不正确导致的。可以尝试以下两种方法解决该问题： 1. 在webpack.prod.conf.js中的output添加参数publicPath:’./’，这样打包后的文件路径就会相对于当前...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 6
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值