Angular项目中加载@auth0/angular-jwt包文件出错求助

Hey there, let's work through this file loading error you're seeing after setting up @auth0/angular-jwt in your VS2015 Angular app. Below are targeted solutions to resolve the issue:

1. Verify Angular Version Compatibility #

The most common culprit here is a version mismatch between your Angular project and the @auth0/angular-jwt package. VS2015 typically works with older Angular versions (2-5), while newer @auth0/angular-jwt releases require Angular 6+.

• First, check your Angular version by running this in your CMD window:

  ng --version
  

• If you're on Angular 2-5, install a compatible version of the package:

  npm install --save @auth0/angular-jwt@1.2.0
  

2. Ensure JwtModule is Imported in Your Angular Module #

You need to register the JWT service in your app's module so Angular's dependency injection can find it. Add this to your AppModule (or relevant feature module):

import { NgModule } from '@angular/core';
import { JwtModule } from '@auth0/angular-jwt';

// Function to retrieve your auth token (adjust based on where you store it)
export function tokenGetter() {
  return localStorage.getItem('access_token');
}

@NgModule({
  imports: [
    // Other imports...
    JwtModule.forRoot({
      config: {
        tokenGetter: tokenGetter,
        // Add allowed domains/routes as needed for your app
        allowedDomains: ['your-api-domain.com'],
        disallowedRoutes: ['your-api-domain.com/api/auth']
      }
    })
  ],
  // Other module settings...
})
export class AppModule {}

3. Clean npm Cache and Reinstall Dependencies #

Corrupted node_modules or npm cache can cause file loading issues. Run these commands in order:

# Clear npm cache
npm cache clean --force

# Delete node_modules folder and package-lock.json (Windows commands)
rmdir /s node_modules
del package-lock.json

# Reinstall all dependencies
npm install

4. Update TypeScript Version #

Older VS2015 setups may have an outdated TypeScript version that conflicts with @auth0/angular-jwt. Install a compatible TypeScript version for your Angular project:

For Angular 5, use:

npm install typescript@2.9.2 --save-dev

5. Double-Check Import Paths #

Make sure your import statement for JwtHelperService is spelled correctly (case-sensitive!):

import { JwtHelperService } from '@auth0/angular-jwt';

A typo here will lead to a file not found error.

内容的提问来源于stack exchange，提问作者Sanjeev S