title: How to include image in Vue Component CSS inline styles in a none relative path?
body: <p>So I have this Component code</p>
  
  <pre><code>&lt;template&gt;
    &lt;div class="example-class"&gt;
      &lt;p&gt;Test&lt;/p&gt;
    &lt;/div&gt;
  &lt;/template&gt;
  &lt;style&gt;
    .example-class {
       background-image: url("HOW to include the image here?");
    }
  &lt;/style&gt;
  </code></pre>
  
  <p>How can I include the image in that style section code?</p>
  
  <p>My component is in a directory</p>
  
  <pre><code>src/component/sample-comp/MyComponent.vue
  </code></pre>
  
  <p>My images are in a directory </p>
  
  <pre><code>assets/images
  </code></pre>
  
  <p>I already tried using <code>@/assets/images/sample-image.png</code> It wont include the image. It is giving an error below</p>
  
  <pre><code> ERROR  Failed to compile with 1 errors                                                                                                                                      08:53:42
  This relative module was not found:
  
      * ./@/assets/images/cta-bg.png in ./~/css-loader?{"minimize":false,"sourceMap":false}!./~/vue-loader/lib/style-compiler?{"vue":true,"id":"data-v-18a303e8","scoped":false,"hasInlineConfig":false}!./~/vue-loader/lib/selector.js?type=styles&amp;index=0!./src/components/frontend/landing-layouts/CallToAction.vue
  </code></pre>