Customize the destination location for the manifest file and for the output assets

[boggye]

Hi,

This is what I want: in production mode, I want all the react assets created from npm build to be placed in the wwwroot/react folder.

To do that, I set outDir: '../wwwroot/react',. This is good. The problem is that in production mode, the following tag:

<script type="module" vite-src="~/Account/Agreement/main.jsx" asp-append-version="true"></script>

is not rendered properly and I get this:

warn: Vite.AspNetCore.Services.ViteManifest[0]
      The chunk 'Account/Agreement/main.jsx' was not found
fail: Vite.AspNetCore.TagHelpers.ViteTagHelper[0]
      "Account/Agreement/main.jsx" was not found in Vite manifest file (check /Views/Account/Agreement.cshtml)

In program.cs I have:

builder.Services.AddViteServices(new ViteOptions
{
  Manifest = "assets.manifest.json",
  Base = "/react",
});

assets.manifest.json is created in wwwroot/react and it contains:

{
  "Account/Agreement/main.jsx": {
    "file": "js/agreement.5b9423ef.js",
    "imports": [
      "_client-chunk.js"
    ],
    "isEntry": true,
    "src": "Account/Agreement/main.jsx"
  },
  "_client-chunk.js": {
    "file": "js/client-chunk.js"
  }
}

I checked the source code, and at this line the key is prefixed with the base path. But if add the base path in front, it works in Production mode but it stops working in Development mode:
<script type="module" vite-src="~/react/Account/Agreement/main.jsx" asp-append-version="true"></script>

Any idea on how to fix it?

Edit: just an explanation why I want to put these files in a different folder. wwwroot contains other css files, images, scripts etc. which are referenced in the pages that don't use react, and it doesn't make sense to delete the content of this folder every time I do the npm run build

Thanks

[Eptagone]

Hi. You forgot to set the base option in your vite.config.ts file.
See this example in the wiki.

[boggye]

Thanks. I cannot get it to work without having 2 script references, one for production and one for development, or only one where for the production one I add the dist prefix as per the example.