03-路径前“~”

<img src="~assets/imgs/tabbar/home.svg" alt="" slot="item-icon">

~,webpack中的一个配置，路径前面加上“~”表示你后面的值为alias，然后就会去webpack.config文件中（脚手架2+以上创建的项目） alias配置中寻找相应的值，然后拼接成最后的地址：

resolve：{

alias: {

// 脚手架4 node-modules->@vue-cli-service-lib-config-base内部已经配置过@

// '@': 'src',

    'assets':'@/assets',

'common':'@/common',

'components':'@/components',

'network':'@/network',

'views':'@/views'

}

}

~assets/imgs/tabbar/home.svg

等于

@/assets/imgs/tabbar/home.svg

等于

src/assets/imgs/tabbar/home.svg