DEV Community

ferouzkassim
ferouzkassim

Posted on

Asp.net javascript bundling

Javascript Failed to import Modules with asp.net back end

hey there are you using and failing in the browser

import {package} form "packageName"

well yes the browser cannot undesrtand your node modules you need a bundler to build the javascript esmModules to js files e.g parcel, webpack, Vite

yes this will work but hold on.

What if you have a back end with asp.net my choice is Vite.

A nugget with detailed instructions is here

https://github.com/Eptagone/Vite.AspNetCore

`using Vite.AspNetCore;

`
// ---- Service Configuration ----

// Add Vite services.

builder.Services.AddViteServices();

// ---- App Configuration ----

// Use the Vite Development Server when the environment is Development.

if (app.Environment.IsDevelopment())

{

// WebSockets support is required for HMR (hot module reload).

// Uncomment the following line if your pipeline doesn't contain it.

// app.UseWebSockets();

// Enable all required features to use the Vite Development Server.

// Pass true if you want to use the integrated middleware.

app.UseViteDevelopmentServer(/* false */);

}
`
`

thats all and we are good` to go so Vite will build your Esm Modules and generate a main.js file which you will impoert in you layout.cshtml file with this the browser willl reference your imports from that main js file

hope you find this usefull
Image description

Top comments (0)