javascriptangularfrontendangular17

Failed to load url /admin/polyfills.js (resolved id: /admin/polyfills.js). Does the file exist?” Angular 17 route with the path /admin/xxxx

I’m working on an Angular 17 application and I’m trying to create a route with the path /admin/xxxx. However, when I try to access the route http://localhost:4200/admin/dashboard, I get the following error: enter image description here

20:44:30 [vite] Pre-transform error: Failed to load url /admin/polyfills.js (resolved id: /admin/polyfills.js). Does the file exist? 20:44:30 [vite] Pre-transform error: Failed to load url /admin/main.js (resolved id: /admin/main.js). Does the file exist?

Here’s what my code looks like: ps : when i use path : '' it works fine with routes http://localhost:4200/dashboard

{
    path: 'admin',
    // canActivate: [AuthGuard],
    // canActivateChild: [AdminGuard],
    component: LayoutComponent,
    data: {
      layout: 'admin',
    },
    children: [
      {
        path: 'users',
        loadChildren: () =>
          import('./modules/users/users.module').then((m) => m.UsersModule),
      },
      {
        path: 'dashboard',
        loadChildren: () =>
          import('./modules/dashboard/dashboard.module').then(
            (m) => m.DashboardModule
          ),
      },
      {
        path: '',
        redirectTo: 'dashboard',
        pathMatch: 'full',
      },
    ],
  },

Can anyone help me figure out what’s causing this error and how to fix it?

Solution

  • I have the same problem and find a solution here

    https://github.com/angular/angular-cli/issues/26897

    It is an issue that was corrected in the code, but I updated all my package and still have the problem.

    In the url someone suggest to use "externalDependencies":[""], in the options of angular.json.

    In angular.json:

    {
    "projects": {
        "Your Project": {
            "architect": {
                "build": {
                    "builder": "@angular-devkit/build-angular:application",
                    "options": {
                        "externalDependencies":[""],

    and it worked to me. I hope it can help, and I suggest to visit the url.