8

I have upgraded from angular 12 to angular 13. Now after upgrading when I tries to run my application. It runs perfectly but in console it is getting the error.

index.js:37 Uncaught TypeError: __webpack_require__.h is not a function
at Module.38202 (index.js:37:58)
at __webpack_require__ (bootstrap:19:1)
at __webpack_exec__ (styles.css?231c:1:1)
at styles.css?231c:1:1
at webpackJsonpCallback (jsonp chunk loading:71:1)
at styles.js:1:109

Can anyone help me to resolve this error.

Ashwani Tandon
  • 129
  • 1
  • 5
  • I have the same error. Are you using angular elements? – Robert Brower May 05 '22 at 09:35
  • I am also having this issue, have you been able to fix it? I can't find any solution online. I've deleted node_modules and package-lock.json, compared package versions against a fresh Angular 13 project, and updated every package I can and nothing works. – Brandon Rader May 26 '22 at 15:51
  • @BrandonRader I am stuck at this till now. Nothing works. – Ashwani Tandon Jun 07 '22 at 07:46
  • @AshwaniTandon I have fixed it on my build, but I made so many changes that I'm not sure which one fixed it. It does seem that they changed the dev server. Are you also using Angular in an ASP.NET Core site by chance? I had to make a change in my Startup.cs file that fixed some issues with ng serve. – Brandon Rader Jun 07 '22 at 21:58
  • @BrandonRader Yes, I am using ASP.NET Core site. Can you please share it so that I can try. – Ashwani Tandon Jun 10 '22 at 05:10
  • @AshwaniTandon See my answer on this question: https://stackoverflow.com/questions/72117401/angular-13-ng-serve-changes-not-being-served – Brandon Rader Jul 13 '22 at 14:25
  • @BrandonRader My issue is I'm using the library called concat to join three web component (bundle) js files into one js file. If in the host app I point at the main.js file, things work. If I try to use the file that is a concatenation of main + polyfills + runtime, it fails with a _ _ webpack_require _ _.r error. This is like totally different from what you were resolving, isn't it? There's nothing on the web to help me. – StackOverflowUser Feb 18 '23 at 05:56
  • @StackOverflowUser It’s been so long that I can’t recall. I upgraded the webpack dev server and that started the issue. I think ASP.NET Core and the new webpack server were both serving up some JS files and it caused a conflict, but I’m not sure. – Brandon Rader Feb 19 '23 at 22:04

4 Answers4

2

Deleting the contents of my compiled JavaScript output directory (dist/ is default) before rebuilding the Angular/TypeScript files solved the issue for me.

I had the same issue developing an Angular/ASP.NET Core site and it was preventing IISExpress from serving updated files as well as hot reloading (very annoying during development).

Farmer Blake
  • 38
  • 5
2

Had the same issue, deleted .angular folder and node_modules folder. Reinstalled the packages npm i.

And the important part is to clear the cache in your browser. Open dev-tools F12 and RIGHT-click on the reload icon (circle arrow) --> empty cache and hard reload.

After that it worked for me.

Henkolicious
  • 1,273
  • 2
  • 17
  • 34
1

Add into your babel.rc :

    sourceType: "unambiguous",

Sauce

Trip
  • 26,756
  • 46
  • 158
  • 277
0

Came here looking for answers, but what fixed this issue for me was changing the port I was serving from. Something somewhere was caching an old version of the site.

To clarify a little bit further, I have a .NET Core server that proxy serves my Angular client locally. Changing the .NET Core server from 44316 to 44319 solved everything.

And yes, I did try clearing my browser/application caches and tried other browsers even.

William Herrmann
  • 343
  • 2
  • 10