Laravel Mix doesn't grab/read .env.development file


In my root folder I have 2 files .env and .env.development. When I run build in development mode laravel mix always grabs/reads .env and ignores the .env.development file. Is/Can laravel mix grab the development env file?

My setup:

./.env:

MIX_FOO=1

./.env.development:

MIX_FOO=2

./package.json:

{
  "scripts": {
    "dev": "node node_modules/cross-env/dist/bin/cross-env.js NODE_ENV=development node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
    "watch": "node node_modules/cross-env/dist/bin/cross-env.js NODE_ENV=development node_modules/webpack/bin/webpack.js --watch --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
    "production": "node node_modules/cross-env/dist/bin/cross-env.js NODE_ENV=production node_modules/webpack/bin/webpack.js --progress --hide-modules --config=node_modules/laravel-mix/setup/webpack.config.js",
    "rmdist": "rimraf dist"
  },
  ...

./webpack.mix.js:

  let mix = require('laravel-mix');
  mix.setPublicPath('dist')
     .js('src/app.js', 'scripts/')
     .extract([
        'jquery',
        'axios',
        'babel-polyfill',
        'lodash',
        'tether',
        'vue',
        'bootstrap-vue',
        'vuex',
        'vuex-localstorage'
     ])
     .sass('src/styles/app.scss', 'styles/')
     .copyDirectory('src/assets', 'dist/assets')
     .options({
        processCssUrls: false,
        uglify: true
      })
     .version();

  if (process.env.NODE_ENV === 'development')
     mix.sourceMaps();

I issue the command npm run watch (build in development mode). In my Vue.js app I perform console.log(process.env.MIX_FOO); and it outputs 1.

Is it possible to use different env files depending on the build NODE_ENV?


Sign in to participate in this thread!


We'd like to thank these amazing companies for supporting us