解决 vue 使用 background-image 无法加载图片的问题

发表于 更新于 分类于 阅读次数： 本文字数： 68 阅读时长 ≈ 1 分钟

下面这样写无法正确加载背景图片：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
<template>
  <div class="container"></div>
</template>

<script>
export default {
  name: 'component'
}
</script>

<style scoped lang="scss">
.container {
  height: 40px;
  width: 40px;
  background-image: url('@/assets/image.svg');
}
</style>

正确的做法 url 应该这样写：url('~@/assets/image.svg')

References
vue cli 3 – use background image in style tag