Nativescript - 装饰器不支持错误函数调用，但调用了 'NativeScriptRouterModule'
Nativescript - ERROR Function calls are not supported in decorators but 'NativeScriptRouterModule' was called
我对这个问题很困惑，看来这不是一个常见问题。我正在 运行 构建一个 nativescript angular 项目，我打算在其中构建一个网站，iOS 和 Android 来自相同的代码库。我大约一年前开始了这个项目，然后又回来了。首先，我花了一些时间更新我所有的包。但是，当 运行 ns debug ios 我遇到这个错误。
ERROR in Error during template compile of 'AppRoutingModule'
Function calls are not supported in decorators but 'NativeScriptRouterModule' was called.
Unexpected value 'undefined' imported by the module 'AppRoutingModule in /Users/user/project/src/app/app-routing.module.tns.ts'
Can't export value NativeScriptRouterModule in /Users/user/project/node_modules/@nativescript/angular/nativescript-angular.d.ts from AppRoutingModule in /Users/user/project/src/app/app-routing.module.tns.ts as it was neither declared nor imported!
Error during template compile of 'AppRoutingModule'
Function calls are not supported in decorators but 'NativeScriptRouterModule' was called.
Unexpected value 'undefined' imported by the module 'AppRoutingModule in /Users/user/project/src/app/app-routing.module.ts'
Can't export value NativeScriptRouterModule in /Users/user/project/node_modules/@nativescript/angular/nativescript-angular.d.ts from AppRoutingModule in /Users/user/project/src/app/app-routing.module.ts as it was neither declared nor imported!
Error during template compile of 'AppRoutingModule'
Function calls are not supported in decorators but 'NativeScriptRouterModule' was called.
Error during template compile of 'AppRoutingModule'
Function calls are not supported in decorators but 'NativeScriptRouterModule' was called.
感觉像是打字稿错误我不确定。任何帮助将不胜感激。
我的package.json
{
"name": "project",
"version": "0.0.0",
"scripts": {
"ng": "ng",
"web": "ng serve --live-reload false --disableHostCheck true",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e",
"android": "tns run android --bundle",
"ios": "tns run ios --bundle",
"mobile": "tns run --bundle",
"preview": "tns preview --bundle"
},
"private": true,
"dependencies": {
"@angular/animations": "~10.1.1",
"@angular/common": "~10.1.1",
"@angular/compiler": "~10.1.1",
"@angular/core": "~10.1.1",
"@angular/forms": "~10.1.1",
"@angular/localize": "^10.1.1",
"@angular/platform-browser": "~10.1.1",
"@angular/platform-browser-dynamic": "~10.1.1",
"@angular/router": "~10.1.1",
"@nativescript/angular": "10.1.0",
"@nativescript/core": "7.0.2",
"@proplugins/nativescript-localstorage": "^2.3.2",
"bootstrap": "^4.3.1",
"core-js": "^2.5.4",
"jquery": "^3.4.1",
"moment": "^2.20.1",
"nativescript-geolocation": "5.1.0",
"nativescript-theme-core": "^1.0.6",
"ngx-bootstrap": "^6.1.0",
"reflect-metadata": "~0.1.12",
"rxjs": "~6.5.2",
"rxjs-compat": "6.3.3",
"zone.js": "^0.10.3"
},
"devDependencies": {
"@angular-devkit/build-angular": "^0.1001.0",
"@angular/cli": "^10.1.0",
"@angular/compiler-cli": "10.1.0",
"@nativescript/ios": "7.0.0",
"@nativescript/schematics": "10.0.2",
"@nativescript/types": "~7.0.1",
"@nativescript/webpack": "~3.0.4",
"@ngtools/webpack": "~10.1.0",
"@types/jasmine": "2.8.17",
"@types/jasminewd2": "~2.0.8",
"@types/node": "^14.10.0",
"codelyzer": "^6.0.0",
"jasmine-core": "~3.5.0",
"jasmine-spec-reporter": "~5.0.0",
"karma": "~5.0.0",
"karma-chrome-launcher": "~3.1.0",
"karma-coverage-istanbul-reporter": "~3.0.2",
"karma-jasmine": "~4.0.0",
"karma-jasmine-html-reporter": "^1.5.0",
"nativescript-dev-sass": "~1.6.0",
"nativescript-dev-typescript": "~0.8.0",
"protractor": "~7.0.0",
"ts-node": "~5.0.1",
"tslint": "~6.1.0",
"typescript": "3.9.7",
"uglifyjs-webpack-plugin": "^1.1.6"
},
"main": "main.js"
}
AppRoutingModule 看起来像这样：
import { NgModule } from "@angular/core";
import { Routes } from "@angular/router";
import { NativeScriptRouterModule } from "@nativescript/angular";
import { ErrorComponent, SecureComponent, PublicComponent } from './components';
import { PUBLIC_ROUTES } from './public.routes';
import { SECURE_ROUTES } from './secure.routes';
import { Guard } from './guard';
const APP_ROUTES: Routes = [
{ path: '', component: PublicComponent, children: PUBLIC_ROUTES},
{ path: '', component: SecureComponent, canActivate: [Guard], children: SECURE_ROUTES},
{
path: '**',
component: ErrorComponent
}
];
@NgModule({
imports: [NativeScriptRouterModule.forRoot(APP_ROUTES)],
exports: [NativeScriptRouterModule]
})
export class AppRoutingModule { }
然后像这样导入到我的主模块中：
...
import { AppRoutingModule } from "./app-routing.module.tns";
@NgModule({
bootstrap: [
AppComponent
],
imports: [
NativeScriptModule,
AppRoutingModule,
HttpClientModule,
FormsModule,
ReactiveFormsModule
],
declarations: [
AppComponent,
LoginComponent,
PublicComponent,
SecureComponent,
ErrorComponent,
GeneralComponent,
MainComponent,
MenuComponent,
StoreComponent,
ItemComponent,
HomeComponent,
HashPipe
],
providers: [
AuthService,
AuthRequestService,
StoreRequestService,
OrderRequestService,
StorageService,
Guard,
{
provide: UniversalStorageService,
useValue: mobileStorage
},
{
provide: HTTP_INTERCEPTORS,
useClass: NoopInterceptor,
multi: true
}
],
schemas: [
NO_ERRORS_SCHEMA
]
})
export class AppModule { }
我的文本编辑器突出显示这些行，如下所示引用 Class NativeScriptRouterModule.forRoot(APP_ROUTES) is not an Angular Function.
这对我来说有点阻碍，所以感谢您的帮助。
将导入更改为以下内容：
import { NativeScriptRouterModule } from '@nativescript/angular';
并且由于您是 root 使用 forRoot
@NgModule({
imports: [NativeScriptRouterModule.forRoot(APP_ROUTES)],
exports: [NativeScriptRouterModule]
})
仅供参考：由于 ns7 刚刚问世，您的 nativescript 插件可能无法正常工作，因此请密切关注它们并检查它们是否已更新。祝你好运
"nativescript-geolocation": "5.1.0",
"nativescript-theme-core": "^1.0.6",
DepickereSven 在此处参考了升级 angular 版本所需的更改 https://github.com/NativeScript/nativescript-angular/issues/2238#issuecomment-691459621
删除配置选项
"angularCompilerOptions": {
"enableIvy": false
}
将防止此错误。
此时我应该提到，我首先禁用 Ivy 的原因是为了避免在尝试编译我的应用程序时出现不同的 NGCC 错误。
阅读这篇文章后 https://github.com/angular/angular/issues/37508 我发现了确实导致错误的原因。
在我的例子中，我试图将节点依赖项编译到比其中一些依赖项允许的更高的目标版本。对于此错误，在 tsconfig.json 中，将目标版本从
更改
"compilerOptions": {
"target": "es2017"
...
}
至
"compilerOptions": {
"target": "es5"
...
}
修复了错误。
我对这个问题很困惑，看来这不是一个常见问题。我正在 运行 构建一个 nativescript angular 项目，我打算在其中构建一个网站，iOS 和 Android 来自相同的代码库。我大约一年前开始了这个项目，然后又回来了。首先，我花了一些时间更新我所有的包。但是，当 运行 ns debug ios 我遇到这个错误。
ERROR in Error during template compile of 'AppRoutingModule'
Function calls are not supported in decorators but 'NativeScriptRouterModule' was called.
Unexpected value 'undefined' imported by the module 'AppRoutingModule in /Users/user/project/src/app/app-routing.module.tns.ts'
Can't export value NativeScriptRouterModule in /Users/user/project/node_modules/@nativescript/angular/nativescript-angular.d.ts from AppRoutingModule in /Users/user/project/src/app/app-routing.module.tns.ts as it was neither declared nor imported!
Error during template compile of 'AppRoutingModule'
Function calls are not supported in decorators but 'NativeScriptRouterModule' was called.
Unexpected value 'undefined' imported by the module 'AppRoutingModule in /Users/user/project/src/app/app-routing.module.ts'
Can't export value NativeScriptRouterModule in /Users/user/project/node_modules/@nativescript/angular/nativescript-angular.d.ts from AppRoutingModule in /Users/user/project/src/app/app-routing.module.ts as it was neither declared nor imported!
Error during template compile of 'AppRoutingModule'
Function calls are not supported in decorators but 'NativeScriptRouterModule' was called.
Error during template compile of 'AppRoutingModule'
Function calls are not supported in decorators but 'NativeScriptRouterModule' was called.
感觉像是打字稿错误我不确定。任何帮助将不胜感激。
我的package.json
{
"name": "project",
"version": "0.0.0",
"scripts": {
"ng": "ng",
"web": "ng serve --live-reload false --disableHostCheck true",
"build": "ng build",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e",
"android": "tns run android --bundle",
"ios": "tns run ios --bundle",
"mobile": "tns run --bundle",
"preview": "tns preview --bundle"
},
"private": true,
"dependencies": {
"@angular/animations": "~10.1.1",
"@angular/common": "~10.1.1",
"@angular/compiler": "~10.1.1",
"@angular/core": "~10.1.1",
"@angular/forms": "~10.1.1",
"@angular/localize": "^10.1.1",
"@angular/platform-browser": "~10.1.1",
"@angular/platform-browser-dynamic": "~10.1.1",
"@angular/router": "~10.1.1",
"@nativescript/angular": "10.1.0",
"@nativescript/core": "7.0.2",
"@proplugins/nativescript-localstorage": "^2.3.2",
"bootstrap": "^4.3.1",
"core-js": "^2.5.4",
"jquery": "^3.4.1",
"moment": "^2.20.1",
"nativescript-geolocation": "5.1.0",
"nativescript-theme-core": "^1.0.6",
"ngx-bootstrap": "^6.1.0",
"reflect-metadata": "~0.1.12",
"rxjs": "~6.5.2",
"rxjs-compat": "6.3.3",
"zone.js": "^0.10.3"
},
"devDependencies": {
"@angular-devkit/build-angular": "^0.1001.0",
"@angular/cli": "^10.1.0",
"@angular/compiler-cli": "10.1.0",
"@nativescript/ios": "7.0.0",
"@nativescript/schematics": "10.0.2",
"@nativescript/types": "~7.0.1",
"@nativescript/webpack": "~3.0.4",
"@ngtools/webpack": "~10.1.0",
"@types/jasmine": "2.8.17",
"@types/jasminewd2": "~2.0.8",
"@types/node": "^14.10.0",
"codelyzer": "^6.0.0",
"jasmine-core": "~3.5.0",
"jasmine-spec-reporter": "~5.0.0",
"karma": "~5.0.0",
"karma-chrome-launcher": "~3.1.0",
"karma-coverage-istanbul-reporter": "~3.0.2",
"karma-jasmine": "~4.0.0",
"karma-jasmine-html-reporter": "^1.5.0",
"nativescript-dev-sass": "~1.6.0",
"nativescript-dev-typescript": "~0.8.0",
"protractor": "~7.0.0",
"ts-node": "~5.0.1",
"tslint": "~6.1.0",
"typescript": "3.9.7",
"uglifyjs-webpack-plugin": "^1.1.6"
},
"main": "main.js"
}
AppRoutingModule 看起来像这样：
import { NgModule } from "@angular/core";
import { Routes } from "@angular/router";
import { NativeScriptRouterModule } from "@nativescript/angular";
import { ErrorComponent, SecureComponent, PublicComponent } from './components';
import { PUBLIC_ROUTES } from './public.routes';
import { SECURE_ROUTES } from './secure.routes';
import { Guard } from './guard';
const APP_ROUTES: Routes = [
{ path: '', component: PublicComponent, children: PUBLIC_ROUTES},
{ path: '', component: SecureComponent, canActivate: [Guard], children: SECURE_ROUTES},
{
path: '**',
component: ErrorComponent
}
];
@NgModule({
imports: [NativeScriptRouterModule.forRoot(APP_ROUTES)],
exports: [NativeScriptRouterModule]
})
export class AppRoutingModule { }
然后像这样导入到我的主模块中：
...
import { AppRoutingModule } from "./app-routing.module.tns";
@NgModule({
bootstrap: [
AppComponent
],
imports: [
NativeScriptModule,
AppRoutingModule,
HttpClientModule,
FormsModule,
ReactiveFormsModule
],
declarations: [
AppComponent,
LoginComponent,
PublicComponent,
SecureComponent,
ErrorComponent,
GeneralComponent,
MainComponent,
MenuComponent,
StoreComponent,
ItemComponent,
HomeComponent,
HashPipe
],
providers: [
AuthService,
AuthRequestService,
StoreRequestService,
OrderRequestService,
StorageService,
Guard,
{
provide: UniversalStorageService,
useValue: mobileStorage
},
{
provide: HTTP_INTERCEPTORS,
useClass: NoopInterceptor,
multi: true
}
],
schemas: [
NO_ERRORS_SCHEMA
]
})
export class AppModule { }
我的文本编辑器突出显示这些行，如下所示引用 Class NativeScriptRouterModule.forRoot(APP_ROUTES) is not an Angular Function.
这对我来说有点阻碍，所以感谢您的帮助。
将导入更改为以下内容：
import { NativeScriptRouterModule } from '@nativescript/angular';
并且由于您是 root 使用 forRoot
@NgModule({
imports: [NativeScriptRouterModule.forRoot(APP_ROUTES)],
exports: [NativeScriptRouterModule]
})
仅供参考：由于 ns7 刚刚问世，您的 nativescript 插件可能无法正常工作，因此请密切关注它们并检查它们是否已更新。祝你好运
"nativescript-geolocation": "5.1.0",
"nativescript-theme-core": "^1.0.6",
DepickereSven 在此处参考了升级 angular 版本所需的更改 https://github.com/NativeScript/nativescript-angular/issues/2238#issuecomment-691459621
删除配置选项
"angularCompilerOptions": {
"enableIvy": false
}
将防止此错误。
此时我应该提到，我首先禁用 Ivy 的原因是为了避免在尝试编译我的应用程序时出现不同的 NGCC 错误。
阅读这篇文章后 https://github.com/angular/angular/issues/37508 我发现了确实导致错误的原因。
在我的例子中，我试图将节点依赖项编译到比其中一些依赖项允许的更高的目标版本。对于此错误，在 tsconfig.json 中，将目标版本从
更改"compilerOptions": {
"target": "es2017"
...
}
至
"compilerOptions": {
"target": "es5"
...
}
修复了错误。