语法错误： 意外的令牌"<"系统Js ( 0.21.5v )

Question

我的package.json文件中有Angular 9.0v和NodeJS 12.16v，systemjs 0.21.5v，core js 2.6.9v。我收到这个错误-

(index):153 SyntaxError: Unexpected token '<'
at eval (<anonymous>)
at evaluate (http://localhost:8080/node_modules/systemjs/dist/system.src.js?1582797940325:2860:18)
at http://localhost:8080/node_modules/systemjs/dist/system.src.js?1582797940325:3665:23
at doEvaluateDynamic (http://localhost:8080/node_modules/systemjs/dist/system.src.js?1582797940325:1166:33)
at http://localhost:8080/node_modules/systemjs/dist/system.src.js?1582797940325:1026:17
at doEvaluateDynamic (http://localhost:8080/node_modules/systemjs/dist/system.src.js?1582797940325:1163:9)
at http://localhost:8080/node_modules/systemjs/dist/system.src.js?1582797940325:1026:17
at Object.eval (http://localhost:8080/app/main.js:3:14)
at eval (http://localhost:8080/app/main.js:13:4)
at eval (http://localhost:8080/app/main.js:14:3) Not expecting this error? Report it at https://github.com/mgechev/angular2-  seed/issues

我有服务器和客户端。这是src/client文件，它有主要问题。服务器正在运行。应用程序模块.ts

import { ErrorHandler, NgModule } from '@angular/core';
import { AppComponent } from './app.component';
import { BrowserModule, Title } from '@angular/platform-browser';
import { APP_BASE_HREF } from '@angular/common';
import { RouterModule } from '@angular/router';
import { routes } from './app.routes';
import { Http, HttpModule, RequestOptions, XHRBackend } from '@angular/http';
import {FormsModule, ReactiveFormsModule} from '@angular/forms';
import { AppRequestOptions, LoaderService, MessageService, SessionStorageService, ThemeChangeService,
BaseService, CommonService } from './shared/index';
import { ContactService } from './framework/dashboard/contact/contact.service';
import { ContactService1 } from  './framework/home-page/home-page.service';
import { ActivateUserComponent } from './framework/registration/activate-user/activate-user.component';
import { ActiveUserService } from './framework/registration/activate-user/activate-user.service';
import { RedirectRecruiterDashboardService } from './user/services/redirect-dashboard.service';
import { LoggerService, MyErrorHandler } from './build-info/framework/my-error-handler.service';
import { UserModule } from './user/user.module';
import { SharedModule } from './shared/shared.module';
import { CustomHttp } from './shared/services/http/custom.http';
import { SharedService } from './shared/services/shared-service';
import { PageNotFoundComponent } from './shared/page-not-found/page-not-found.component';
import { AuthGuardService } from './shared/services/auth-guard.service';
import { HttpDelegateService } from './shared/services/http-delegate.service';
//Application IMPORTS
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import {ValidationService} from './shared/customvalidations/validation.service';
import {ErrorService} from './shared/services/error.service';
import {UsageTrackingService} from './build-info/framework/usage-tracking.service';
import {CreateProjectModule} from './build-info/framework/create-project/create-project.module';
import {DashboardModule} from './framework/dashboard/dashboard.module';
import {BuildingModule} from './build-info/framework/project/building/building.module';
import {ResetPasswordModule} from './framework/login/forgot-password/reset-password/reset-password.module';
import {CreateBuildingModule} from './build-info/framework/project/building/create-building/create-building.module';
import {LoginModule} from './framework/login/login.module';
import {CandidateSignUpModule} from './framework/registration/candidate-sign-up/candidate-sign-up.module';
import {ForgotPasswordModule} from "./framework/login/forgot-password/forgot-password.module";
import { AdminComponent } from './build-info/framework/admin/admin.component';
import { AdminService } from './build-info/framework/admin/admin.service';
import {ProjectHeaderVisibilityService} from "./shared/services/project-header-visibility.service";
@NgModule({
imports: [
BrowserModule,
FormsModule,
RouterModule.forRoot(routes),
HttpModule,
ReactiveFormsModule,
SharedModule,
UserModule,
CreateProjectModule,
CreateBuildingModule,
BuildingModule,
DashboardModule,
ResetPasswordModule,
ForgotPasswordModule,
LoginModule,
CandidateSignUpModule,
BrowserAnimationsModule
],
declarations: [
AppComponent,
ActivateUserComponent,
PageNotFoundComponent,
AdminComponent
],
providers: [
{
provide: Http,
useFactory: httpFactory,
deps: [XHRBackend, RequestOptions, MessageService, LoaderService]
},
{provide: RequestOptions, useClass: AppRequestOptions},
LoggerService, {provide: ErrorHandler, useClass: MyErrorHandler},
{
provide: APP_BASE_HREF,
useValue: '<%= APP_BASE %>'
},
ContactService,
ContactService1,
ActiveUserService,
RedirectRecruiterDashboardService,
SharedService,
Title,
AuthGuardService,
HttpDelegateService,
LoaderService,
UsageTrackingService,
ValidationService,
SessionStorageService,
MessageService,
SharedService,
ThemeChangeService, CommonService, BaseService, CustomHttp, ErrorService, SessionStorageService,
AdminService,
ProjectHeaderVisibilityService
],
bootstrap: [AppComponent]
})
export class AppModule {
}
export function httpFactory(backend: XHRBackend, defaultOptions: RequestOptions, messageService: MessageService,
loaderService: LoaderService) {
return  new CustomHttp(backend, defaultOptions, messageService, loaderService);
}

上面的代码是app.module.ts

Answer 1

在网络选项卡中检查所有包是否已正确加载，或者如果在该包中看到html，则表示尚未找到文件。

这是因为节点模块没有正确加载。我通过在一个system.config.ts.中导入所有模块解决了这个问题

另外在index.html 中添加这些行

<script src="<%= APP_BASE %>app/system-config.js"></script>
<script>
System.import('app').catch(function (err) { console.error(err) })
</script>

系统配置

SystemJS.config({
paths: {
['app/main'] : `app/main`,
'@angular/animations':
'node_modules/@angular/animations/bundles/animations.umd.js',
'@angular/platform-browser/animations':
'node_modules/@angular/platform-browser/bundles/platform-browser-animations.umd.js',
'@angular/common': 'node_modules/@angular/common/bundles/common.umd.js',
'@angular/compiler':
'node_modules/@angular/compiler/bundles/compiler.umd.js',
'@angular/core': 'node_modules/@angular/core/bundles/core.umd.js',
'@angular/forms': 'node_modules/@angular/forms/bundles/forms.umd.js',
'@angular/common/http': 'node_modules/@angular/common/bundles/common-http.umd.js',
'@angular/platform-browser':
'node_modules/@angular/platform-browser/bundles/platform-browser.umd.js',
'@angular/platform-browser-dynamic':
'node_modules/@angular/platform-browser-dynamic/bundles/platform-browser-dynamic.umd.js',
'@angular/router': 'node_modules/@angular/router/bundles/router.umd.js',
'@angular/animations/browser':
'node_modules/@angular/animations/bundles/animations-browser.umd.js',
'@angular/common/testing':
'node_modules/@angular/common/bundles/common-testing.umd.js',
'@angular/compiler/testing':
'node_modules/@angular/compiler/bundles/compiler-testing.umd.js',
'@angular/core/testing':
'node_modules/@angular/core/bundles/core-testing.umd.js',
'@angular/common/http/testing':
'node_modules/@angular/common/bundles/common-http-testing.umd.js',
'@angular/platform-browser/testing':
'node_modules/@angular/platform-browser/bundles/platform-browser-testing.umd.js',
'@angular/platform-browser-dynamic/testing':
'node_modules/@angular/platform-browser-dynamic/bundles/platform-browser-dynamic-testing.umd.js',
'@angular/router/testing':
'node_modules/@angular/router/bundles/router-testing.umd.js',
'html2canvas': 'node_modules/html2canvas/dist/html2canvas.min.js',
'lodash': 'node_modules/lodash/lodash.js',
'device_uuid': 'node_modules/device-uuid/lib/device-uuid.min.js',
'highcharts': 'node_modules/highcharts/highcharts.js',
'jspdf': 'node_modules/jspdf/dist/jspdf.min.js',
'app/': `/app/`,
// For test config
'dist/dev/': '/base/dist/dev/',
'': 'node_modules/',
},
packages: {
'app': {
main: 'main.js',
defaultExtension: 'js'
},
'rxjs': {
main: 'index.js',
defaultExtension: 'js'
},
'rxjs/operators': {
main: 'index.js',
defaultExtension: 'js'
},
'rxjs/internal/operators': {
main: 'index.js',
defaultExtension: 'js'
},
}
});