Comment est-ce que je rends l'URL d'arrière-plan CSS: après modification dans VueJS

Question

J'utilise simple-webpack vuecli pour implémenter mon site. J'ai un bouton qui a un: après modifié qui produit un contenu avec url chemin d'arrière-plan. Comment puis-je utiliser le require sur background-url dans css? On dirait que le style en ligne ne fonctionne pas pour: après CSS modifié.

mondial SCSS

.btn-green .btn-text:after{ 
    content: ""; 
    width: 7px; 
    height: 10px; 
    background: url('/assets/img/svg/arrow-right.svg') no-repeat 0 0; 
    background-size: 100%; 
    display: inline-block; 
    margin-left: 5px; 
    padding-bottom: 11px; 
} 

Modèle Vue

<div class="btn-green universal-shadow"> 
    <div class="btn-text">GET STARTED</div> 
</div> 

Answer 1

Vous devez utiliser un chemin relatif autrement Webpack interprétera comme une URL réelle au lieu d'un chemin d'accès à un module il devrait exiger.

url('assets/img/svg/arrow-right.svg') 
    ^removed the leading/