vue-cli

可以将图片直接放在项目生成的 static 文件夹里,然后在components里面直接采用绝对路径去取就可以了。

在根目录里面都会有一个static目录,这个是用来存放静态文件的,把静态的文件或者图片放在里面,引用的时候可以使用绝对路径去取,例如:/static/example.png,里面也可以再建立一个专门放图片的文件夹,引用的时候加上路径便可/static/imgs/example.png

vue-cli background iamge的更多相关文章

  1. vue cli 3.x 项目部署到 github pages

    github pages 是 github 免费为用户提供的服务,写博客,或者部署一些纯静态项目. 最近将 vue cli 3.x 初始化项目部署到 github pages,踩了一些坑,记录如下. ...

  2. vue cli 3

    介绍 Vue CLI 是一个基于 Vue.js 进行快速开发的完整系统 通过 @vue/cli 搭建交互式的项目脚手架. 通过 @vue/cli + @vue/cli-service-global 快 ...

  3. @vue/cli 3.0 使用 svg-sprite-loader 加载本地 SVG 文件

    目录 @vue/cli 3.0 使用 svg-sprite-loader 加载本地 SVG 文件 运行 使用 配置 svg-sprite-loader 调用当前环境下的颜色 props @vue/cl ...

  4. vue cli使用融云实现聊天

    公司有个项目要实现一个聊天功能,需求如下图,略显随意 公司最终选择融云这个吊炸天的即时通信,文档详细的一匹,刚开始看文档感觉很详细实现起来也不麻烦,有很多开源的demo可以在线演示和下载 不过我们的项 ...

  5. Vue CLI 3.0脚手架如何在本地配置mock数据

    前后端分离的开发模式已经是目前前端的主流模式,至于为什么会前后端分离的开发我们就不做过多的阐述,既然是前后端分离的模式开发肯定是离不开前端的数据模拟阶段. 我们在开发的过程中,由于后台接口的没有完成或 ...

  6. Vue CLI 3使用:浏览器兼容性

    package.json 文件里的 browserslist 字段 (或一个单独的 .browserslistrc 文件),指定了项目的目标浏览器的范围.这个值会被 @babel/preset-env ...

  7. 基于vue cli 3.0创建前端项目并安装cube-ui

    前提条件: 安装node.js. 国内的开发者最好先配置淘宝镜像. 之后用cnpm来代替npm命令. 项目创建过程: 打开cmd,输入命令进入目标工作空间,以本机项目为例: cd /d d: cd D ...

  8. Vue CLI 3+tinymce 5富文本编辑器整合

    基于Vue CLI 3脚手架搭建的项目整合tinymce 5富文本编辑器,vue cli 2版本及tinymce 4版本参考:https://blog.csdn.net/liub37/article/ ...

  9. vue cli 3.0创建项目

    .npm i -g @vue/cli .vue create my-project 此处有两个选择: 1.default (babel, eslint)默认套餐,提供babel和eslint支持 2. ...

  10. vue cli 3 lintOnSave 配置有时无效问题

    一个使用vue cli 3.2创建的项目,创建时未开启 lintOnSave,后来希望开启并设置为 lintOnSave: 'error',但配置不生效. 解决方法1:新创建项目(此时vue cli ...

随机推荐

  1. python迟邦定

    1.绑定 将函数体和函数调用关联起来,就叫绑定 2.迟绑定 在程序运行之前(也就是编译和链接时)执行的绑定是早绑定,迟绑定(late binding)是发生在运行时. 3.实例说明 def outer ...

  2. python pip命令技巧

    确保本地开发环境,和线上一致性 1.导出当前解释器的模块pip3 freeze > requirements.txt 2.将这个文件requirements.txt,上传至服务器,在新的虚拟环境 ...

  3. BS一机双屏的解决方式

    一.WebSocket通讯 WebSocket protocol 是HTML5一种新的协议.它实现了浏览器与server全双工通信. 为保证socket不间断.使用下面类库进行socket通讯. ht ...

  4. Data striping

    条带化是把连续的数据分割成相同大小的数据块,把每段数据分别写入到阵列中的不同磁盘上的方法. 当多个进程同时访问一个磁盘时,可能会出现磁盘冲突.大多数磁盘系统都对访问次数(每秒的 I/O 操作,IOPS ...

  5. J.U.C Atomic(二)基本类型原子操作

    java.util.concurrent.atomic包中对基本类型进行原子操作的类有:AtomicInteger.AtomicBoolean.AtomicLong. 下面通过一个测试程序来验证一下A ...

  6. LoadJS

    LoadJS是一个微小的异步加载器为现代浏览器(711字节). https://github.com/muicss/loadjs 介绍 LoadJS是一个微小的异步加载库的现代浏览器(IE9 +). ...

  7. 等待事件对应的p1,p2,p3含义

    Oracle 10g v$session视图中不同等待事件对应的p1,p2,p3的含义也不同,我们不可能记住所有等待事件对应的p1,p2,p3的含义. 可以通过查询V$EVENT_NAME知道每个等待 ...

  8. 以About Us为范例在Zen cart中增加页面

    1.在includes\languages\english\html_includes目录中新建文件define_about_us.php 2.在includes\templates\Your_tem ...

  9. 从硬件到语言,详解C++的内存对齐(memory alignment)

    转载请保留以下声明 作者:赵宗晟 出处:https://www.cnblogs.com/zhao-zongsheng/p/9099603.html 很多写C/C++的人都知道“内存对齐”的概念以及规则 ...

  10. 关于ldap的学习

    主要从以下网站学习了相关基础知识概念,安装与基本配置. http://www.aikaiyuan.com/8269.htmlhttps://segmentfault.com/a/11900000026 ...