Nuxt Use Different buildDir for Development and Production

Solution 1: dotenv

Edit env.development.

BUILD_DIR=.nuxt-dev

Edit env.production.

BUILD_DIR=.nuxt

Edit nuxt.config.js.

export default {  ...  buildDir: process.env.BUILD_DIR,  ...}

export default {  ...  buildDir: process.env.NODE_ENV == 'production' ? '.nuxt' : '.nuxt-dev',  ...}

NOTE: When npm run dev is run, process.env.NODE_ENV == 'development'. When npm run build is run, process.env.NODE_ENV == 'production'

export default {  ...  buildDir: process.env.BUILD_DIR  ...}

Edit package.json

{  ...  "scripts": {    "dev": "env BUILD_DIR=.nuxt-dev nuxt",    "build": "env BUILD_DIR=.nuxt nuxt build",    ...  }  ...}

NOTE: If you are using dotenv with the same environment variable specified, dotenv will overwrite the environment variable.

❤️ Is this article helpful?

Buy me a coffee ☕ or support my work via PayPal to keep this space 🖖 and ad-free.

Do send some 💖 to @d_luaz or share this article.

✨ By Desmond Lua

A dream boy who enjoys making apps, travelling and making youtube videos. Follow me on @d_luaz

👶 Apps I built

Travelopy - discover travel places in Malaysia, Singapore, Taiwan, Japan.