Set process.env.API_URL in Nuxt.js project hosted on Netlify

Viewed 415

I am working on a project where the backend is based on Strapi and hosted on Heroku and the frontend is based on Nuxt and hosted on Netlify. The project works fine when I host it locally, and deploying the backend to Heroku worked fine too.

However, the Netlify app is still trying to connect to my localhost. I set the environment variable in my Netlify project in the webinterface.

Key: API_URL, Value: https://***.herokuapp.com/

In my nuxt.config.js I have this entry:

  modules: ["@nuxtjs/strapi"],  
  strapi: {
    entities: ["educations"],
    url: "process.env.API_URL || http://localhost:1337"
  }

Which I thought would use the API_URL instead of the localhost, once deployed to Netlify. However, like I said, the hosted version still tries to connect to http://localhost:1337

1 Answers

As mentioned in the @nuxt/strapi documentation you can just set STRAPI_URL=your.netlify.domain as an environment variable in Netlify. It will overwrite Strapi's url option. Don't forget to delete the url option in your current configuration.

Related