1、在vue项目中,我们经常需要引用图片等资源,每次用相对路径来说太麻烦

2、于是将要解决在vue-cli下搭建的项目配置绝对路径的位置

配置如下:

在项目中的build文件夹下的webpack.base.conf.js中进行配置(配置详情如上图)

在项目中使用配置好的绝对路径如下:

使用~加上你配置的绝对路径的路径名就可以在项目中使用了

如上我配置的绝对路径名:F:/travel-vue-h5/src/assets/mages/紫霞.jpg

我配置的路径如下: 

'assets': resolve('src/assets/')

该路径的绝对路径名我就叫做assets

使用的时候直接

 <img src="~assets/images/紫霞.jpg" alt="">

解决!!!!

到此这篇关于vue-cli 配置资源引用的绝对路径的文章就介绍到这了,更多相关vue-cli 配置资源内容请搜索Devmax以前的文章或继续浏览下面的相关文章希望大家以后多多支持Devmax!

解决vue-cli 配置资源引用的绝对路径问题的更多相关文章

  1. xcode4 – 如何将分组的(本地化)文件的位置从XCode 4中的绝对路径更改为相对路径?

    我已经尝试将文件组的路径位置更改为例如“相对于组”或“相对于项目”.对于组我也设置相对路径单击小图标吹动文件检查器中的位置下拉列表.我一直在寻找一个解决方案一段时间,并欣赏,如果有人可以帮助我回答上述问题.谢谢!

  2. xcode – xcrun因zip I / O错误而失败:没有这样的文件或目录zip错误:

    尝试使用xcrun导出存档失败,出现以下错误:解决方法xcrun需要绝对路径.(即/User/you/…

  3. Swift3.0语言教程使用路径字符串

    Swift3.0语言教程使用路径字符串Swift3.0语言教程使用路径字符串,路径其实是字符串的一种,我们称为路径字符串。importFoundationletcomponents:[String]=["Users","mac","Desktop","File.txt"]letpath=Nsstring.path//组合路径print运行结果如下:Users/mac/Desktop/File.txt2.分割路径在Nsstring中有组合路径相对的就有分割路径,使用pathComponents属性就可以实现

  4. android – 获取PhoneGap中资产文件夹的绝对路径

    有没有办法获得电话卡资产文件夹中图像的绝对路径?

  5. vue-cli使用stimulsoft.reports.js的详细教程

    Stimulsoft Reports.JS是一个使用JavaScript和HTML5生成报表的平台。它拥有所有拥来设计,编辑和查看报表的必需组件。该报表工具根据开发人员数量授权而不是根据应用程序的用户数量。接下来通过本文给大家介绍vue-cli使用stimulsoft.reports.js的方法,一起看看吧

  6. 脚手架(vue-cli)创建Vue项目的超详细过程记录

    用vue-cli脚手架可以快速的构建出一个前端vue框架的项目结构,下面这篇文章主要给大家介绍了关于脚手架(vue-cli)创建Vue项目的超详细过程,文中通过实例代码介绍的非常详细,需要的朋友可以参考下

  7. jsp下显示中文文件名及绝对路径下的图片解决方法

    jsp显示中文文件名的图片:将Tomcat中的server.xml文件中改为,在tomcat的server.xml以及与大家分享下显示绝对路径下的图片的方法

  8. vue-cli中的图片资源存放位置详解

    这篇文章主要介绍了vue-cli中的图片资源存放位置,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教

  9. vue 如何实现配置@绝对路径

    这篇文章主要介绍了vue 如何实现配置@绝对路径,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教

  10. node.js与vue cli脚手架的下载安装配置方法记录

    这篇文章主要给大家介绍了关于node.js与vue cli脚手架的下载安装配置方法,文中通过实例代码以及图文介绍的非常详细,对大家学习或者工作具有一定的参考学习价值,需要的朋友可以参考下

随机推荐

  1. js中‘!.’是什么意思

  2. Vue如何指定不编译的文件夹和favicon.ico

    这篇文章主要介绍了Vue如何指定不编译的文件夹和favicon.ico,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教

  3. 基于JavaScript编写一个图片转PDF转换器

    本文为大家介绍了一个简单的 JavaScript 项目,可以将图片转换为 PDF 文件。你可以从本地选择任何一张图片,只需点击一下即可将其转换为 PDF 文件,感兴趣的可以动手尝试一下

  4. jquery点赞功能实现代码 点个赞吧!

    点赞功能很多地方都会出现,如何实现爱心点赞功能,这篇文章主要为大家详细介绍了jquery点赞功能实现代码,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

  5. AngularJs上传前预览图片的实例代码

    使用AngularJs进行开发,在项目中,经常会遇到上传图片后,需在一旁预览图片内容,怎么实现这样的功能呢?今天小编给大家分享AugularJs上传前预览图片的实现代码,需要的朋友参考下吧

  6. JavaScript面向对象编程入门教程

    这篇文章主要介绍了JavaScript面向对象编程的相关概念,例如类、对象、属性、方法等面向对象的术语,并以实例讲解各种术语的使用,非常好的一篇面向对象入门教程,其它语言也可以参考哦

  7. jQuery中的通配符选择器使用总结

    通配符在控制input标签时相当好用,这里简单进行了jQuery中的通配符选择器使用总结,需要的朋友可以参考下

  8. javascript 动态调整图片尺寸实现代码

    在自己的网站上更新文章时一个比较常见的问题是:文章插图太宽,使整个网页都变形了。如果对每个插图都先进行缩放再插入的话,太麻烦了。

  9. jquery ajaxfileupload异步上传插件

    这篇文章主要为大家详细介绍了jquery ajaxfileupload异步上传插件,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

  10. React学习之受控组件与数据共享实例分析

    这篇文章主要介绍了React学习之受控组件与数据共享,结合实例形式分析了React受控组件与组件间数据共享相关原理与使用技巧,需要的朋友可以参考下

返回
顶部