title: How to use different API endpoints for two different production builds?
body: <p>I need to generate two production builds. One for staging and one for final production. I use <code>vue-cli-service build</code> to create a build. What I need is to make two npm scripts which will use different API endpoints for different conditions.</p>
  <p>Below is the file where I export my api endpoint.
  <code>src/config/index.js</code></p>
  <pre><code>import dev from &quot;./dev.env.js&quot;;
  import prod from &quot;./prod.env.js&quot;;
  let api
  if (process.env.NODE_ENV === &quot;production&quot;) {
    api = dev
  }
  if (process.env.NODE_ENV === &quot;finalprod&quot;) {
    api = prod
  }
  export default api;
  </code></pre>
  <p>And in the <code>package.json</code> script I have</p>
  <pre><code>&quot;build&quot;: &quot;vue-cli-service build&quot;,
  &quot;buildprod&quot;: &quot;NODE_ENV=finalprod vue-cli-service build&quot;,
  </code></pre>
  <p>This seems to solve the problem.
  But the issue with this is that, when the environment is changed to <code>finalprod</code>, then the <code>build</code> command doesn't generate a <strong>production</strong> build.</p>
  <p>Also I checked <a href="https://cli.vuejs.org/guide/mode-and-env.html#modes" rel="nofollow noreferrer">this url</a>, but couldn't get my solution from this.</p>
  <h2>Note:</h2>
  <ol>
  <li>I don't have CI/CD setup, so I don't have any env in the server. I just create a build on my local and use <code>ftp</code> to upload the build to server which serves static files.</li>
  <li>I initiated the project using command <code>vue create project-name</code></li>
  </ol>