title: npm run build --mode [.env.mode] not working as expected
body: <p><strong>What I've done so far:</strong></p>
  
  <p>I've been trying to setup multiple build modes like <code>staging</code>, <code>testing</code>, <code>production</code> and <code>development</code> based on <code>NODE_ENV=production</code>. So I'm keeping the respective files in the root of the project folder like:</p>
  
  <ul>
  <li>.env.production</li>
  <li>.env.staging</li>
  <li>.env.testing</li>
  <li>.env.development</li>
  </ul>
  
  <p>Now, all these files are having </p>
  
  <pre><code>NODE_ENV=production
  VUE_APP_ENV=&lt;mode&gt;
  </code></pre>
  
  <p>The <a href="https://cli.vuejs.org/guide/mode-and-env.html#example-staging-mode" rel="noreferrer">document</a> that I followed clearly states that,</p>
  
  <blockquote>
    <p><code>vue-cli-service build --mode staging</code> builds a <strong>production</strong> app in
    <strong>staging mode</strong>, using .env, .env.staging and .env.staging.local if they
    are present.</p>
  </blockquote>
  
  <p><strong>Problem:</strong></p>
  
  <p>As expected, running the command <code>npm run build --mode staging</code> is to give a production build with variable as listed in the <code>.env.staging</code> file. However, <code>production</code> variables are loaded instead of <code>staging</code>.</p>
  
  <p><strong>Ref:</strong></p>
  
  <ul>
  <li><a href="https://cli.vuejs.org/guide/mode-and-env.html#example-staging-mode" rel="noreferrer">https://cli.vuejs.org/guide/mode-and-env.html#example-staging-mode</a></li>
  <li><a href="https://forum.vuejs.org/t/how-to-build-production-app-with-varying-config/29708" rel="noreferrer">https://forum.vuejs.org/t/how-to-build-production-app-with-varying-config/29708</a></li>
  </ul>