Cannot use webpack middleware in ASP.NET Core

Question

I try to use webpack in ASP.NET Core project

Here is my Startup.cs file and Configure class

public void Configure(IApplicationBuilder app, IHostingEnvironment env)
    {
        if (env.IsDevelopment())
        {
            app.UseDeveloperExceptionPage();
            app.UseWebpackDevMiddleware(new WebpackDevMiddlewareOptions
            {
                HotModuleReplacement = true
            });
        }
        else
        {
            app.UseExceptionHandler("/Home/Error");
            app.UseHsts();
        }

        app.UseHttpsRedirection();
        app.UseStaticFiles();
        app.UseCookiePolicy();

        app.UseMvc(routes =>
        {
            routes.MapRoute(
                name: "default",
                template: "{controller=Home}/{action=Index}/{id?}");
        });
    }

And Here is my package.json file

    {
 "name": "streamline",
 "version": "1.0.0",
 "description": "",
 "main": "index.js",
 "scripts": {
  "test": "echo \"Error: no test specified\" && exit 1",
  "wbp": "webpack"
 },
 "keywords": [],
 "author": "",
 "license": "ISC",
 "devDependencies": {
  "aspnet-webpack": "^3.0.0",
  "bootstrap": "^4.1.2",
  "css-loader": "^1.0.0",
  "extract-text-webpack-plugin": "^4.0.0-beta.0",
  "jquery": "^3.3.1",
  "popper.js": "^1.14.3",
  "style-loader": "^0.21.0",
  "uglifyjs-webpack-plugin": "^1.2.7",
  "webpack": "^4.16.1",
  "webpack-cli": "^3.0.8",
  "webpack-hot-middleware": "^2.22.2"
 },
 "dependencies": {
  "@babel/core": "^7.0.0-beta.53",
  "@babel/preset-env": "^7.0.0-beta.53",
  "babel-loader": "^8.0.0-beta.4"
 }
}

When I try to run project, I got this error. But i don't know why. How I can solve this issue?

Exception has occurred: CLR/System.AggregateException
An exception of type 'System.AggregateException' occurred in System.Private.CoreLib.dll but was not handled in user code: 'One or more errors occurred.'
 Inner exceptions found, see $exception in variables window for more details.
 Innermost exception     Microsoft.AspNetCore.NodeServices.HostingModels.NodeInvocationException : Error: Cannot find module 'webpack-dev-middleware'
    at Function.Module._resolveFilename (internal/modules/cjs/loader.js:594:15)
    at Function.Module._load (internal/modules/cjs/loader.js:520:25)
    at Module.require (internal/modules/cjs/loader.js:650:17)
    at require (internal/modules/cjs/helpers.js:20:18)
    at attachWebpackDevMiddleware (/Users/nemesises/Documents/GitHub/streamline/StreamLine/node_modules/aspnet-webpack/WebpackDevMiddleware.js:72:13)
    at /Users/nemesises/Documents/GitHub/streamline/StreamLine/node_modules/aspnet-webpack/WebpackDevMiddleware.js:271:25
    at Array.forEach (<anonymous>)
    at Server.<anonymous> (/Users/nemesises/Documents/GitHub/streamline/StreamLine/node_modules/aspnet-webpack/WebpackDevMiddleware.js:234:36)
    at Object.onceWrapper (events.js:273:13)
    at Server.emit (events.js:182:13)
    at emitListeningNT (net.js:1362:10)
    at process._tickCallback (internal/process/next_tick.js:63:19)
   at Microsoft.AspNetCore.NodeServices.HostingModels.HttpNodeInstance.<InvokeExportAsync>d__7`1.MoveNext()
   at System.Runtime.ExceptionServices.ExceptionDispatchInfo.Throw()
   at System.Runtime.CompilerServices.TaskAwaiter.HandleNonSuccessAndDebuggerNotification(Task task)
   at System.Runtime.CompilerServices.TaskAwaiter`1.GetResult()
   at Microsoft.AspNetCore.NodeServices.HostingModels.OutOfProcessNodeInstance.<InvokeExportAsync>d__13`1.MoveNext()
   at System.Runtime.ExceptionServices.ExceptionDispatchInfo.Throw()
   at System.Runtime.CompilerServices.TaskAwaiter.HandleNonSuccessAndDebuggerNotification(Task task)
   at System.Runtime.CompilerServices.TaskAwaiter`1.GetResult()
   at Microsoft.AspNetCore.NodeServices.NodeServicesImpl.<InvokeExportWithPossibleRetryAsync>d__10`1.MoveNext()
   at System.Runtime.ExceptionServices.ExceptionDispatchInfo.Throw()
   at Microsoft.AspNetCore.NodeServices.NodeServicesImpl.<InvokeExportWithPossibleRetryAsync>d__10`1.MoveNext()

Make sure you install both of these if you using react with webpack & .net core "aspnet-webpack": "3.0.0", "aspnet-webpack-react": "3.0.0" — user4851087
– user4851087, Commented Jul 16, 2018 at 14:44
But I don't want to use react, just webpack with HotModuleReplacement@NgôHùngPhúc — Eugene Sukh
– Eugene Sukh, Commented Jul 17, 2018 at 6:29
What I'm trying to say is HotModuleReplacement is using for React or Angular, I'm using it in my project so I know. — user4851087
– user4851087, Commented Jul 17, 2018 at 6:32

David · Accepted Answer · 2018-07-25 14:29:37Z

4

I had same issue. Solution for me...

npm install --save-dev webpack-cli

This gave me the clue npm WARN [email protected] requires a peer of webpack-dev-middleware@^1.8.4 || ^3.0.0 but none is installed. You must install peer dependencies yourself. npm WARN [email protected] No repository field.

Then..

npm install --save-dev webpack-dev-middleware

Now it runs and works fine.

answered Jul 25, 2018 at 14:29

David

3,1874 gold badges47 silver badges83 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

Cannot use webpack middleware in ASP.NET Core

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related