首先，assets文件夹和static文件夹在vue-cli生成的项目中，都是用来存放静态资源的。

1、assets目录中的文件会被webpack处理解析为模块依赖，只支持相对路径形式。build的时候由Webpack解析为模块依赖。

 2、static/ 目录下的文件并不会被Webpack处理：它们会直接被复制到最终的打包目录（默认是dist/static）下。必须使用绝对路径引用这些文件，这是通过在 config.js 文件中的 build.assetsPublicPath 和 build.assetsSubDirectory 连接来确定的。
    任何放在 static/ 中文件需要以绝对路径的形式引用：/static/[filename]。
  所以如果需要引用static目录下的图片及其他资源，应该使用绝对路径，webpack配置如下：

vue 项目中assets文件夹与static文件夹引用的区别的更多相关文章

  1. vue项目中使用bpmn-流程图xml文件中节点属性转json结构

    内容概述 本系列“vue项目中使用bpmn-xxxx”分为七篇,均为自己使用过程中用到的实例,手工原创,目前陆续更新中.主要包括vue项目中bpmn使用实例.应用技巧.基本知识点总结和需要注意事项,具 ...

  2. vue 项目中assets 和static的区别

    一.Webpacked Assets 为了回答这个问题,我们首先需要了解Webpack如何处理静态资产.在 *.vue 组件中,所有模板和CSS都会被 vue-html-loader 及 css-lo ...

  3. 踩坑，vue项目中，main.js引入scss文件时报错

    当我们在src目录下创建.scss文件,并在main.js中引用,运行时会报: ERROR Failed to compile with 1 errors 5:25:07 PMThis relativ ...

  4. vue项目中使用bpmn-基础篇

    内容概述 本系列“vue项目中使用bpmn-xxxx”分为五篇,均为自己使用过程中用到的实例,手工原创,目前属于陆续更新中.主要包括vue项目中bpmn使用实例.应用技巧.基本知识点总结和需要注意事项 ...

  5. vue项目中使用bpmn-自定义platter

    前情提要 经过前四篇的学习,我们能够实现bpmn基本绘图.预览.为节点加事件加颜色等效果,这一篇我们来说,如何自定义左侧工具栏(platter),首先看一下自定义前后效果图对比: 我们本次要实现的目标 ...

  6. vue项目中使用bpmn-流程图预览篇

    前情提要 上文已经实现了节点操作的前进.后退.导入.导出等操作,今日来实现“流程图预览”,以及视图的放大缩小 前提:项目安装过bpmn,安装可见上篇文章 实现要点 bpmn提供了两个神器:Modele ...

  7. vue项目中使用bpmn-节点篇

    前情提要 根据之前的操作,我们可以创建.导入.导出流程图,并对其进预览.通过此篇可以学到: 为节点添加点击.鼠标悬浮等事件 获取流程图内所有指定类型的节点 通过外部更新节点名字 获取节点实例的两种方法 ...

  8. vue项目中使用bpmn-为节点添加颜色

    内容概述 本系列 “vue项目中使用bpmn-xxxx” 分为五篇,均为自己使用过程中用到的实例,手工原创,目前属于陆续更新中.主要包括vue项目中bpmn使用实例.应用技巧.基本知识点总结和需要注意 ...

  9. vue项目中使用bpmn-番外篇(留言问题总结)

    前情提要 “vue项目中使用bpmn-xxxx”系列的七篇文章在上周已经更新完成,发表后,有小伙伴在使用时提出了一些文章中没有讲到的问题,此篇作为番外篇,将大家提出的共性问题解答一下,欢迎大家支持原创 ...

随机推荐

  1. 关于 Apache 的 25 个初中级面试题

    关于 Apache 的 25 个初中级面试题 出自:http://blog.jobbole.com/60471/

  2. 滚动到指定位置js

    function mScroll(id){ $("html,body").stop(true); $(); }

  3. [转]Oracle dbms_random函数用法快速生成多条测试数据

    Java 随机生成中文姓名,手机号,邮编,住址:http://blog.csdn.net/xiaokui_wingfly/article/details/45913885 Java 批量随机生成身份证 ...

  4. 漫游Kafka设计篇之性能优化（7）

    Kafka在提高效率方面做了很大努力.Kafka的一个主要使用场景是处理网站活动日志,吞吐量是非常大的,每个页面都会产生好多次写操作.读方面,假设每个消息只被消费一次,读的量的也是很大的,Kafka也 ...

  5. LINQ to SQL语句(2)Count/Sum/Min/Max/Avg操作符

    使用场景 类似于SQL中的聚合函数,用于统计数据,不延迟.如返回序列中的元素数量.求和.最小值.最大值.求平均值. Count 说明:用于返回集合中元素的个数,返回Int类型,生成SQL语句为SELE ...

  6. [转]Mac下cocos2dx-3.2+Xcode环境配置和项目创建

    原文:http://blog.csdn.net/u012200908/article/details/38070885 这是有关环境配置的第二篇教程,第一篇讲的是win8下的环境配置.这里我们使用C+ ...

  7. 170331、58到家MQ如何快速实现流量削峰填谷

    问:为什么会有本文? 答:上一篇文章<到底什么时候该使用MQ?>引起了广泛的讨论,有朋友回复说,MQ的还有一个典型应用场景是缓冲流量,削峰填谷,本文将简单介绍下,MQ要实现什么细节,才能缓 ...

  8. Servlet------>ServletConfig和ServletContext

    原理图: 之一--------->servletConfig 有些时候,有些参数不适合写死,而且初始化servlet要用,可以通过这个头来调用servletConfig 例如:serlet数据库 ...

  9. Exchange Port

    Get-POPSettings-110 Get-IMAPSettings-143 Exchange Network Port References Exchange Server 2000 http: ...

  10. textarea文本输入区内实现换行

    在文本间输入 即可成功换行 <textarea class="mytextarea">1.第一行 2.第二行 </textarea>