飞道的博客

拥抱 Vite2.0 系列(静态资源处理)

605人阅读  评论(0)

Importing Asset as URL

导入静态资产时,将返回解析后的公共URL:

import imgUrl from './img.png'
document.getElementById('hero-img').src = imgUrl

例如,在开发阶段,imgUrl将是/img.png,而在生产版本中,它将变成/assets/img.2d8efhg.png。

其行为类似于webpack的文件加载器。区别在于导入既可以使用绝对公共路径(基于开发期间的项目根路径),也可以使用相对路径。

CSS中的url()引用也以同样的方式处理。

如果使用Vue插件,Vue SFC模板中的资产引用将自动转换为导入。

常见的图像、媒体和字体文件类型被自动检测为资产。您可以使用assetsInclude选项扩展内部列表。

引用的资产作为构建资产图的一部分包括在内,将得到散列文件名,并可以由插件进行处理


转载:https://blog.csdn.net/qq_36772866/article/details/113954556
查看评论
* 以上用户言论只代表其个人观点,不代表本网站的观点或立场