vue项目完成打包上线的时候很多人都会碰到静态资源找不到的问题，常见的有两个

1、js，css路径不对

解决办法：打开config/index.js，将其中的assetsPublicPath值改为’./’

2、css中引用的图片资源找不到

我的login.vue文件中有一段css，其中引用了一个背景图片，是这样写的

.login{height:100%;background: url("../assets/login_bg.jpg") no-repeat; background-size: cover;color: white;}

“src/assets/”文件夹下有这张图片，打包后路径发生变化这个图片就找不到了，stackflow上有一个解决办法，很简单

打开“build/utils.js”，增加一行代码即可

原文地址：http://www.ftc20.com/wordpress/2017/11/vue-static-resource-route-question/

vue打包静态资源路径不正确的解决办法【转】的更多相关文章

  1. vue打包静态资源路径不正确的解决办法

    vue打包静态资源路径不正确的解决办法 vue项目完成打包上线的时候会碰到静态资源找不到的问题,常见的有两个 1.js,css路径不对 解决办法:打开config/index.js,将其中的asset ...

  2. vue+webpack静态资源路径引用

    处理静态资产 你可能已经注意到,在项目结构中我们有两个静态资产目录:src/assets和static/.他们之间有什么区别? 要回答这个问题,我们首先需要了解Webpack如何处理静态资产.在*.v ...

  3. vue项目之webpack打包静态资源路径不准确

    摘自:https://blog.csdn.net/viewyu12345/article/details/83187815 问题 将打包好的项目部署到服务器,发现报错说图片找不到. 静态资源如js访问 ...

  4. vue打包静态资源后显示空白及static文件路径报错

    1.打包之后打开dist的页面显示空白: 这个是打包项目比较常见的一个错误 改一下config下面的index.js中bulid模块导出的路径.因为打包后的index.html里边的内容都是通过scr ...

  5. Vue Cli 打包之后静态资源路径不对的解决方法

    cli2版本: 将 config/index.js 里的 assetsPublicPath 的值改为 './' . build: { ... assetsPublicPath: './', ... } ...

  6. vue打包后出现一些map文件的解决方法

    Vue打包后出现一些map文件的解决办法: 问题: 可能很多人在做vue项目打包,打包之后js中,会自动生成一些map文件,那我们怎么把它去掉不要呢? 1.运行  cnpm run build  开始 ...

  7. 用node.js express设置路径后 子路径下的页面访问静态资源路径出问题

    在routes/news_mian.js 设置了访问news_main.html 的路径 '/',通知设置一个访问news-page.html的子路径'/newspage'子路径.但是在访问loacl ...

  8. springboot之静态资源路径配置

    静态资源路径是指系统可以直接访问的路径,且路径下的所有文件均可被用户直接读取. 在Springboot中默认的静态资源路径有:classpath:/META-INF/resources/,classp ...

  9. 13.1Springboot 之 静态资源路径配置

    Spring 静态资源路径是指系统可以直接访问的路径,且路径下的所有文件均可被用户直接读取. 在Springboot中默认的静态资源路径有:classpath:/META-INF/resources/ ...

随机推荐

  1. DSAPI 简单WebAPI实现

    使用DSAPI实现一个简单的WebAPI功能,以便各客户端访问.支持身份验证,支持基础防护. 新建项目(以下演示控制台示例),引用DSAPI.dll. 复制粘贴以下代码: Module Module1 ...

  2. Python实例----------每日一贴

    def function_tips(): '''功能:每天输出一条励志文字 ''' import datetime # 导入日期时间类 # 定义一个列表 mot = ["今天星期一:\n人生 ...

  3. vue 数据改变但是视图没更新

    在使用过程中会出现数据改变但是视图没有更新的情况(类型数组或者对象),这里我们就需要用到 $set 如果是对象类型: this.$set(this.userInfo, 'name', 'gionlee ...

  4. Dynamics CRM项目实例之九：CRM 2015的产品中的捆绑销售

    关注本人微信和易信公众号: 微软动态CRM专家罗勇,回复140或者20150112可方便获取本文,同时可以在第一时间得到我发布的最新的博文信息,follow me!      今天的博客主要是介绍Dy ...

  5. WebGL或OpenGL关于模型视图投影变换的设置技巧

    目录 1. 具体实例 2. 解决方案 1) Cube.html 2) Cube.js 3) 运行结果 3. 详细讲解 1) 模型变换 2) 视图变换 3) 投影变换 4) 模型视图投影矩阵 4. 存在 ...

  6. Spark MLlib FPGrowth关联规则算法

    一.简介 FPGrowth算法是关联分析算法,它采取如下分治策略:将提供频繁项集的数据库压缩到一棵频繁模式树(FP-tree),但仍保留项集关联信息.在算法中使用了一种称为频繁模式树(Frequent ...

  7. 经典51道SQL查询练习题

    数据表介绍 --1.学生表 Student(SId,Sname,Sage,Ssex) --SId 学生编号,Sname 学生姓名,Sage 出生年月,Ssex 学生性别 --2.课程表 Course( ...

  8. SQL Server 增加链接服务器

    exec sp_addlinkedserver '名称' , '' , 'SQLOLEDB' , '10.102.29.xxx' exec sp_addlinkedsrvlogin '名称' , 'f ...

  9. WebApi接收post方式传入的json数据

    [RoutePrefix("Api")] public class UploadController:BaseApiController { [HttpPost] [Route(& ...

  10. linux下的别名机制

    相当于用户自己创建一个属于自己的命令.在当前用户的家目录下有一个.bashrc文件,编辑该文件: eg:alias cls='clear' 如果命令要生效需要重新登录.用户输入cls就可以达到清屏的目 ...