Docs Guide Directory Structure
.env
A .env file specifies your build/dev-time environment variables.
.gitignore file to avoid pushing secrets to your repository.Dev, Build and Generate Time
Nuxt CLI has built-in dotenv support in development mode and when running nuxi build and nuxi generate.
In addition to any process environment variables, if you have a .env file in your project root directory, it will be automatically loaded at dev, build and generate time. Any environment variables set there will be accessible within your nuxt.config file and modules.
MY_ENV_VARIABLE=hello.env or removing the .env file entirely will not unset values that have already been set.Custom File
If you want to use a different file - for example, to use .env.local or .env.production - you can do so by passing the --dotenv flag when using nuxi.
npx nuxi dev --dotenv .env.localWhen updating .env in development mode, the Nuxt instance is automatically restarted to apply new values to the process.env.
Production Preview
After your server is built, you are responsible for setting environment variables when you run the server.
Your .env file will not be read at this point. How you do this is different for every environment.
For local production preview purpose, we recommend using nuxi preview since using this command, the .env file will be loaded into process.env for convenience. Note that this command requires dependencies to be installed in the package directory.
Or you could pass the environment variables as arguments using the terminal. For example, on Linux or macOS:
DATABASE_HOST=mydatabaseconnectionstring node .output/server/index.mjsNote that for a purely static site, it is not possible to set runtime configuration config after your project is prerendered.
appConfig may be a better choice. You can define appConfig both within your nuxt.config (using environment variables) and also within an ~/app.config.ts file in your project.