raw-loader的使用

如果你的webpack版本是5,可以使用新的资源模块asset/source

在使用webpack导入文件时,偶尔会有导入文件原始文本内容的需求 —— 比如导入视图模板,做动态更新视图。

import tmpl from 'HeaderView.vue'
or
import tmpl from 'HeaderView.html'
or
import tmpl from 'HeaderView.tmpl'

模板可以是任意后缀,但通常会选择技术对应且IDE提供语法加亮的模板类型,比如.vue文件,但如果按上例直接导入通常会得到一个对象而不是文本。
下面来看raw-loader如何实现这一目标:

//inline 方式
import tmpl from '!!raw-loader!HeaderView.vue'

!!前缀用于取消所有loader

使用前请确保已安装raw-loader

npm install raw-loader --save-dev

你可能感兴趣的:(raw-loader的使用)