[Vuejs]-How to set URL for axios?

0👍

If you are using laravel-mix, (React, Vue or even Vanilla JS file which compiled by mix):

In your Javascript file:

import axios from 'axios'
const API_URL = process.env.MIX_APP_URL +'/api/'

// rest of your code...

Add this in your .env file:

MIX_APP_URL="${APP_URL}"

And re-compile your scripts by npm run prod, or npm run dev or npm run watch. Whichever you need.

If you are using in blade file, process.env isn’t accessible there. Instead, add this:

const API_URL = {{url('/')}} +'/api/'

If you are using standalone nuxt.js:
Add in nuxt.config.js

export default {
  env: {
    baseUrl: process.env.BASE_URL || 'http://localhost:3000'
    appUrl: process.env.APP_URL,
  }
}

And in your js file:

import axios from 'axios'

axios.create({
  baseURL: process.env.appUrl
});

// rest of your code

Leave a comment