Use BASE_URL in component's JavaScript - Vue.js

You probably already know you can use BASE_URL in your HTML markup like this:

<link rel="manifest" href="<%= BASE_URL %>manifest.json">Code language: HTML, XML (xml)

If you want to use it within JavaScript you can define a publicPath in your component's data like this:

data() {
   return {
     publicPath: process.env.BASE_URL,
     user: {},
   };
 },Code language: JavaScript (javascript)

Then simply use it as a regular .vue file or template like any variable:

<img :src="`${publicPath}img/icon.svg`" alt="My Image">Code language: HTML, XML (xml)

Use BASE_URL in component’s JavaScript – Vue.js