首先，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. Service层事务不能回滚的解决方式

    1.在service方法里面如果对异常进行了捕获的话,该事务是不会进行回滚的        默认spring事务只在发生未被捕获的 runtimeexcetpion时才回滚.          spr ...

  2. Apache -- 压力测试工具ab.exe

    ab全称ApacheBench是Apache超文本传输协议(HTTP)的性能测试工具.是描绘当前所安装的Apache的执行性能, 主要是显示你安装的Apache每秒可以处理多少个请求Apache自带的 ...

  3. 最新Android面试题集锦

    近期由于某些原因想换工作,整理一下个人认为面试中还比較值得记录的一些题目,给须要找这方面工作的人一个借鉴. 下面基本仅仅记录题目或者大概答案,假设大家有比較具体的解答或者比較好的面试题木,希望各位看到 ...

  4. 把本地仓库导入到Github

    1, create a new rep 2, 进入到本地仓库: $ git remote set-url origin URL 3,上传 git push -v ref: https://www.do ...

  5. hdu 2528:Area（计算几何，求线段与直线交点 + 求多边形面积）

    Area Time Limit: 5000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Total Submis ...

  6. Logstash zabbix 插件

    zabbix 监控 logstash 安装社区扩展包wget http://download.elasticsearch.org/logstash/logstash/logstash-contrib- ...

  7. Github+Jekyll —— 创建个人免费博客（五）jekyllproject公布到github上

    摘要: 本文中我将介绍一下怎样在github上搭建个人Blog(博客),也顺便让我们掌握一下github Pages功能,另外还涉及到Jekyll技术. ======================= ...

  8. __construct __destory __call __get __set

    1,__construct() 当实例化一个对象的时候,这个对象的这个方法首先被调用. 我们知道 php5对象模型 < ,所以__construct()作为类的默认的构造函数 而不会调用同类名函 ...

  9. Zabbix自动发现与主动注册

    接上篇:Zabbix监控主动模式 网络自动发现 zabbix agent的配置文件/etc/zabbix/zabbix_agentd.conf 注释StartAgents=0 添加 HostnameI ...

  10. Storm-源码分析-Topology Submit-Task-TopologyContext (backtype.storm.task)

    1. GeneralTopologyContext 记录了Topology的基本信息, 包含StormTopology, StormConf 已经从他们推导出的, task和component, co ...