在做VUE +的WebPack脚手架项目打包完成后,在IIS服务器上运行发现项目中的背景图片加载不出来检查项目代码发现是因为CSS文件中,背景图片引用的路径问题;后来通过修改配置文件,问题终于解决了,解决方法如下: 注意:如果整体为空白,记得先改===>>> 1.记得改一下config下面的index.js中bulid模块导出的路径.因为index.html里边的内容都是通过script标签引入的,而你的路径不对,打开肯定是空白的.先看一下默认的路径. module.exports =…

vue项目打包之后背景图片出错的解决方案如下: 1,找到 config->index.js里面,如下修改 默认配置: env: require('./prod.env'), index: path.resolve(__dirname, '../dist/index.html'), assetsRoot: path.resolve(__dirname, '../dist'), assetsSubDirectory: 'static', assetsPublicPath: '/', 修改为: env…

在build->webpack.base.conf.js里添加一句代码: 具体位置在module->rules下 publicPath:"../../",…

1, 2,…

1. 创建 loading 公用组件 <template> <div class="load-container"> <div class="load"></div> <div class="text">加载中...</div> </div> </template> <script> export default { name: 'Load…

1.问题表现:首屏缺失部分图标.点击按钮切换为激活状态时,部分按钮的激活态图标无法显示. 2.问题原因:网络极差,断断续续,点击时添加class:active变为激活态, active.png这张图片是在添加active这个class才加载的, css背景图片只加载一次,不管成功还是失败都不再加载第二次了, 所以刚好网络断掉时加载了active.png失败,不刷新的话,以后就再也看不到这张图片了 3.解决办法: 方法一: 把所有图片做成spirit图,首次就可以把所有图片加载好,不会出现部分图片…

在使用vue开发项目的时候,经常会遇到的一个问题就是:图片加载不出来.下面是我总结的几种图片加载不出来的情况及解决办法. 一.项目打包完成后,打开整体空白 1.路径问题 原因 在vue+webpack的项目中,项目打包之后的css和js的引用路径是绝对路径,项目部署之后会将静态当成根目录,就造成了文件引用路径的错误. 解决办法 通过修改配置文件,将绝对路径改为相对路径. 具体操作如下: 1.vue-cli 3.0版本之前 配置config下面的index.js中bulid模块导出的路径.因为in…

在开发vue项目的过程中,使用浏览器进行预览的时候所有图片的路径是没有任何问题的,但是在打包后传到服务器上,在微信端查看背景图片时,background的图片竟然不显示,img标签里的图片却是正常展示的,通过网上查询,找到了解决的办法,但是大部分都没有讲造成这种问题的原因,故我简单地总结了一下,并加入了一些自己的理解,欢迎共同探讨~ 当用vue-cli自动构建项目后,有两种运行方法,分别是: npm run dev : 提供一个开发的环境,自动热更新,资源使用绝对路径,所以可以正常看到背景图片.…

1.原因解析 当用vue-cli自动构建项目后,有两种运行方法,分别是: npm run dev : 提供一个开发的环境,自动热更新,资源使用绝对路径,所以可以正常看到背景图片. npm run build : 打包项目,资源使用相对路径,所以会出现路径错误问题. 注: 绝对路径:从盘符开始的路径,如:C:\windows\system32\cmd.exe 相对路径:从当前路径开始的路径 构建后的项目, 都需要读取静态资源,静态资源分为三种, JS, CSS, IMG,目录结构如下: //结构目…

博主刚刚解决了index.html空白问题,刚打开项目页面又发现了样式出现了大问题,样式与开发版本有很大不同,有些样式没有生效.利用搜索引擎,找到了问题所在以及解决办法:main.js中的引入顺序决定了打包后css的顺序,组件内的样式没有生效可能是被第三方组件样式覆盖了,所以把第三方组件放在前面引入,router放在后面引入,就可以实现组件样式在第三方样式之后渲染.代码如下: main.js // The Vue build version to load with the `import` c…