I'm using Angular 15.0.4 and when I run ng serve -o to launch my app, the app doesn't compile and run, and I get this message:
√ Browser application bundle generation complete.
Initial Chunk Files | Names | Raw Size
vendor.js | vendor | 3.55 MB |
styles.css, styles.js | styles | 351.25 kB |
polyfills.js | polyfills | 314.27 kB |
main.js | main | 72.00 kB |
runtime.js | runtime | 6.51 kB |
| Initial Total | 4.28 MB
Build at: 2023-01-11T15:32:28.997Z - Hash: 7b4d3ef0affc1690 - Time: 7179ms
Warning: C:\work-temp\angular-example\QuickCBT\src\main.ts depends on 'core-js/es7/reflect'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies
./src/main.ts:4:0-29 - Error: Module not found: Error: Can't resolve 'core-js/es/reflect' in 'C:\work-temp\angular-example\QuickCBT\src'
** Angular Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200/ **
× Failed to compile.
How can I fix this?
I should note that I already installed core-js@2.5.x by running npm install --save core-js@^2.5.0, following the answers of this question: Error: Can't resolve 'core-js/es7/reflect' in '\node_modules\@angular-devkit\build-angular\src\angular-cli-files\models
Update: I installed core-js@3 and the second error disappeared, but the first error persists.
Here is the output now:
ng serve -o √ Browser application bundle generation complete.
Initial Chunk Files | Names | Raw Size vendor.js | vendor | 3.58 MB | styles.css, styles.js | styles |
351.25 kB | polyfills.js | polyfills | 314.27 kB | main.js | main | 72.00 kB | runtime.js | runtime | 6.51 kB |
| Initial Total | 4.30 MB
Build at: 2023-01-11T16:43:11.909Z - Hash: 77cd44828399b547 - Time: 8190ms
Warning: C:\work-temp\angular-example\QuickCBT\src\main.ts depends on 'core-js/es/reflect'. CommonJS or AMD dependencies can cause optimization bailouts. For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies
./src/main.ts:6:0-30 - Error: Module not found: Error: Can't resolve 'core-js/es7/reflect' in 'C:\work-temp\angular-example\QuickCBT\src'
** Angular Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200/ **
× Failed to compile.
Note: I have cypress installed in my Angular project.
Here is the code with the problem:
// cypress/support/index.ts
// core-js 3.*
require('core-js/es/reflect'); // I'm keeping only this import statement
// core-js 2.*
//require('cypress-angular-unit-test/support');
import { platformBrowserDynamic } from '@angular/platform-browser-dynamic';
import { AppModule } from './app/app.module';
platformBrowserDynamic().bootstrapModule(AppModule)
.catch(err => console.error(err));
This code was likely added by cypress:
require('core-js/es/reflect');
require('core-js/es7/reflect');
Update: I commented out the above lines the app now works. Cypress also works.