vue2.0打包页面成功后，dist文件夹中index.html页面空白的原因

最新推荐文章于 2023-07-14 09:12:31 发布
最新推荐文章于 2023-07-14 09:12:31 发布
阅读量1.7k 收藏
点赞数
分类专栏： vue 文章标签： vue项目打包
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_37699645/article/details/88992097
版权

vue2.0打包页面成功后，dist文件夹中index.html页面空白的原因

因为这个问题看了好多些文章，百试不灵
总结说呢，方法都是对的
这个bug修改的真是尴尬
千万不要像我一样找对了文件改错了位置

第一步
找到config文件下面的index.js

打开后，修改“assetsPublicPath”
切记哦
是build里面的assetsPublicPath
是build里面的assetsPublicPath
是build里面的assetsPublicPath

在这里插入图片描述

修改完后就大功告成啦
希望此文可以帮助到马虎的小伙伴们~

何贤惠
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
打包 Taro-UI 踩过的坑
lazycat的博客
12-29 1954
最近在处理 taro 小程序的优化问题，通过小程序代码依赖分析，其中最大的就是vendors.js，而vendors.js中最大的要属taro-ui的包了。
vue-cli打包后本地运行dist文件中的index.html操作
10-14
主要介绍了vue-cli打包后本地运行dist文件中的index.html操作，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
如何解决vue2.0 打包之后 打开index.html出现空白页
qq_15038747的博客
03-03 977
如何解决vue2.0 打包之后 打开index.html出现空白页 如何解决vue2.0 打包之后 打开index.html出现空白页 1.打包之前修改三个文件 1.1.第一步，找到build文件，在webpack.prod.conf.js 第25行左右 有一个对象为 output,在这里面增加一行代码 publicPath:'./' output: { ...
打包后dist中的index文件为空白
Hailee7的博客
07-07 370
在vue.config.js文件中的module.exports设置 publicPath: ‘./’
vue-解决项目打包index页面空白详情方案
种子不服古怪的博客
03-02 2364
问题描述 使用npm run build打包项目之后,dist文件夹下的index.html页面出现空白的情况. 排除写代码时路径不正确的情况 解决方法: 1.修改在项目目录下的config文件夹下的index.js 找到build这一块,assetsPublicPath:’/‘更改为’./’ **注意是多加了一个点 ** 2.去掉路由history模式 默认是hash,如果非要使用histor...
vue本地打开build后生成的dist文件夹index.html问题
10-16
主要介绍了vue本地打开build后生成的dist文件夹index.html问题，本文给大家介绍的非常详细，具有一定的参考借鉴价值，需要的朋友参考下吧
解决Vue项目打包后打开index.html页面显示空白以及图片路径错误的问题
01-19
Vue项目运行npm run build后会生成一个dist文件夹，我们一般都是把这个文件夹部署到服务器上。dist文件夹里边有一个static文件和一个index.html页面，这个index就是最后单页面的最终文件。 问题一：我在打包完成后，...
解决Vue项目打包后dist中的index.html用浏览器直接打开显示空白页的问题
最新发布
青春木鱼的博客
07-14 1万+
三种方案解决Vue项目打包后dist中的index.html用浏览器无法直接打开的问题
vue打包后dist页面空白
小不点的博客
11-05 2885
项目中自己的VUE项目通过npm run build打包生成的dist文件，打开本地dist文件夹的index.html页面一片空白。这个主要原因是路径的问题。 1、记得改一下config下面的index.js中bulid模块导出的路径。因为index.html里边的内容都是通过script标签引入的，而你的...
vue项目打包后index.html文件打开空白
热门推荐
guojing5721的专栏
11-08 1万+
build打包vue项目遇到的问题，如下： 1、npm run build打包项目之后，生成的dist文件里面有被压缩后的static文件跟index.html，直接打开index.html页面是空白的，还会报几个错，找不到页面路径。 原因：找到config文件下index.js，会发现build下的 assetsPublicPath：' / ' 默认为根目录，而index.html和stat...
vue cli3 build 打包后的的dist文件夹内的index.html如何本地正常打开
q759859479的博客
06-11 2320
一 vue.config.js配置里： module.exports = { publicPath: './', 加入这一行 ** } 官网原文： baseUrl 注意⚠️： 从 Vue CLI 3.3 起已弃用，请使用publicPath。 publicPath Type:string Default:'/' 部署应用包时的基本 URL。用法和 webpack 本身的output.publicPath一致，但是 Vue CL...
vue打包后的dist文件在IE浏览器中打不开（空白页面）
韩大璐
08-08 2480
下载安装 babel-polyfill npm install babel-polyfill --save-dev 安装成功之后在package.json中有了这个依赖包 在main.js文件中引入babel-polyfill 改动webpack.base.config.js 将entry中的app: './src/main.js’配置改为：app: [‘babel-polyf...
vue-cli打包后本地运行dist文件中的index.html
Heart_At_You的博客
03-02 2661
使用npm run build生成dist文件夹中的文件是你需要上传到服务器上的文件， 直接打开index.html会直接报错 可以尝试用express搭建一个服务器，做法如下： 1、在dist根目录下新建server.js文件； 2、代码如下： var express = require('express'); var app = express(); const hostname = 'lo...
vue打包后index文件一片空白
github_38469586的博客
07-25 4686
vue项目你npm run build打包后，点开index文件打开一片空白， 并报错解决方法：路径问题，
vue项目打包访问index.html页面出现空白
muzidigbig的博客
01-04 8496
错误现象： 1.主要的问题就是路径问题 因为index.html里边的内容都是通过script标签引入的，而你的路径不对，打开肯定是空白的。 只要修改config文件夹里的index.js里的assetsPublicPath的值； config/index.js assetsPublicPath默认的是 ‘/’ 也就是根目录。而我们的index.html和static在同一级...
VUE前端代码 执行 npm run build 后 生成dist里面的文件后，如何访问。如何提供给后台使用。
xinhuazhongxue的博客
08-27 1万+
build 之后会生成一个dist目录。打包完命令行是不是这样提示了： Build complete. Tip: built files are meant to be served over an HTTP server. //打包的文件要在http server下运行 Opening index.html over file:// won’t work. //直接打开这个文件不会生效 所以呢，...
vue项目打包之后打开dist/index.html一片空白
05-23
这个问题可能有多种原因，以下是一些可能的解决方案： ...例如，如果你将打包后的 JavaScript 文件放在了一个名为 `assets` 的文件夹中，那么你需要将 index.html 文件中的引用路径修改为 `assets/js/app.js` 等。

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

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

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值