[Vite] fileReplacements is not working for dev-server

[nodegin]

Current Behavior

fileReplacements is not working for dev-server (i.e. serve command)

Expected Behavior

When specifying the fileReplacements in the project.json and running with configuration, the file should also be replaced in local dev server, not just bundling production build.

Github Repo

No response

Steps to Reproduce

1. Add fileReplacements to the project.json

          "fileReplacements": [
            {
              "replace": "apps/core/src/config/config.staging.ts",
              "with": "apps/core/src/config/config.production.ts"
            }
          ],

2. Run local dev server

yarn nx serve core --configuration production  --verbose --skip-nx-cache

3. Observe if the file is replaced

Nx Report

nx : 15.3.0
   @nrwl/angular : Not Found
   @nrwl/cypress : Not Found
   @nrwl/detox : Not Found
   @nrwl/devkit : 15.3.0
   @nrwl/esbuild : Not Found
   @nrwl/eslint-plugin-nx : 15.3.0
   @nrwl/expo : Not Found
   @nrwl/express : Not Found
   @nrwl/jest : 15.3.0
   @nrwl/js : 15.3.0
   @nrwl/linter : 15.3.0
   @nrwl/nest : Not Found
   @nrwl/next : Not Found
   @nrwl/node : Not Found
   @nrwl/nx-cloud : Not Found
   @nrwl/nx-plugin : Not Found
   @nrwl/react : 15.3.0
   @nrwl/react-native : Not Found
   @nrwl/rollup : Not Found
   @nrwl/schematics : Not Found
   @nrwl/storybook : Not Found
   @nrwl/web : Not Found
   @nrwl/webpack : Not Found
   @nrwl/workspace : 15.3.0
   typescript : 4.9.4
   ---------------------------------------
   Local workspace plugins:
   ---------------------------------------
   Community plugins:
   	 @nrwl/vite: 15.3.0

Failure Logs

No response

Additional Information

No response

[nodegin]

I've created PR #13761 to fix this issue

[mandarini]

Thanks for the PR! I added some comments. :D

The fileReplacements should indeed work, since we allow it, but I think we are going to deprecate it soon. We are trying to push users to use import.meta etc for replacements, as the documentation suggests.

[nodegin]

@mandarini Thanks for your help! Yeah I agree maybe its better to support import.meta.env.* but I think maybe worth to keep fileReplacements as @nrwl/webpack supports this option, it may be useful in some cases like patching stuff, not just for using as configs?

[nodegin]

Might be a bit off-topic but also its better to allow passing the MODE for vite in project.json, so we can define environment variables in files like .env.staging

[mandarini]

@nodegin I'll take a note of that suggestion, sure! Will keep in the discussions about keeping or not the fileReplacements.

RE: MODE hmm I have to look into it. We do allow mode, so I'm assuming that does not work for you?

[nodegin]

@mandarini For MODE, yes I think currently it doesn't work well for me.

From the doc mode only allows production and development, so I got this error:

Property 'mode' does not match the schema. 'staging' should be one of production,development.

I think it should accept the NX configurations name instead?
For example in my project I have only staging and production configurations,
or even better to accept any value that user want.

Also, I tried to create a /apps/core/.env.development file, and console.log(import.meta) doesn't comes with the env property. I already added "mode" to my configuration like:

        "staging": {
          "buildTarget": "core:build:staging",
          "mode": "development"
        }

Did I misplaced the file or missed something?

[mandarini]

I think you can try with the latest Nx regarding the mode issue!

[github-actions]

This issue has been closed for more than 30 days. If this issue is still occuring, please open a new issue with more recent context.