Vue-CLI 3 背景画像の「@」が変換されない

Webpack 3~4 の話

@はsrc/のエイリアスになっている、

vue.config.js デフォルトはそういう設定になっているので使ってると、
たまに変換されない時があって困る。

select {
        background-image: url('@/assets/img/image.svg');
        }

↓できた

select {
        background-image: url('~@/assets/img/image.svg');
        }

In order to resolve an alias (@), as you are using, it is mandatory webpack handles the request as a module request. Using the prefix ~ enforces webpack treat the request as a module request, similar to require('some-module/image.svg').

あなたのような使い方のエイリアス（@）を解決するためには、
webpackがリクエストをモジュールリクエストとして扱う必要があります。

接頭辞 ~ を使用するとwebpackはrequire
（'some-module / image.svg'）のように
リクエストをモジュールリクエストとして扱います。

古い時代のハックです。

参考リンク：
https://stackoverflow.com/questions/51812496/vue-cli-3-use-background-image-in-style-tag