如何解决“装饰器不支持函数调用，但调用了‘StoreModule’." [英] How to resolve "Function calls are not supported in decorators but 'StoreModule' was called."
本文介绍了如何解决“装饰器不支持函数调用，但调用了‘StoreModule’."的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
我有一个 angular (7) 项目.
I've an angular (7) project.
在我的 package.json 中，我定义了一个命令:
In my package.json, I've a command defined:
{
"name": "xxx",
"version": "0.1.0",
"scripts": {
"ng": "ng",
"start": "ng serve",
"build": "ng build",
"build-prod": "ng build --prod",
"test": "ng test",
"test-ci": "ng test --no-watch --no-progress --browsers=ChromeHeadlessNoSandbox",
"e2e-ci": "ng e2e --protractor-config=e2e/protractor.conf.js",
"deploy": "firebase deploy --token $FIREBASE_TOKEN --non-interactive",
"lint": "ng lint",
"e2e": "ng e2e"
},
[...]
}
当我在本地运行 npm run build-prod 时，一切正常.
When I just run npm run build-prod locally, everything works nice.
现在我正在尝试在我的 gitlab CI 上执行此代码.
Now I'm trying to have this code executed on my gitlab CI.
为此，我有以下 .gitlab-ci.yml
image: node:10
build:
stage: build
cache:
paths:
- node_modules/
script:
- npm install --quiet
- npm run build-prod
artifacts:
paths:
- dist/
test:
stage: test
cache:
policy: pull
paths:
- node_modules/
script:
# install dependencies to use chrome w/ puppeteer
- apt update && apt install -yq gconf-service libasound2 libatk1.0-0 libc6 libcairo2 libcups2 libdbus-1-3 libexpat1 libfontconfig1 libgcc1 libgconf-2-4 libgdk-pixbuf2.0-0 libglib2.0-0 libgtk-3-0 libnspr4 libpango-1.0-0 libpangocairo-1.0-0 libstdc++6 libx11-6 libx11-xcb1 libxcb1 libxcomposite1 libxcursor1 libxdamage1 libxext6 libxfixes3 libxi6 libxrandr2 libxrender1 libxss1 libxtst6 ca-certificates fonts-liberation libappindicator1 libnss3 lsb-release xdg-utils wget
- npm run test-ci
- npm run e2e-ci
deploy_prod:
stage: deploy
environment:
name: production
url: $FIREBASE_URL
only:
- master
dependencies:
- build
cache:
policy: pull
paths:
- node_modules/
script:
- npm run deploy
但是当它运行时，我得到一个错误:
But when it runs, I get an error:
Running with gitlab-runner 11.10.0-rc2 (10efa505)
on docker-auto-scale 72989761
Using Docker executor with image node:10 ...
Pulling docker image node:10 ...
Using docker image sha256:64c810caf95adbe21b5f41be687aa77aaebc197aa92f2b2283da5d57269d2b92 for node:10 ...
Running on runner-72989761-project-XYZ-concurrent-0 via runner-72989761-srm-1555525988-c992ea28...
Initialized empty Git repository in /builds/XXX/YYY/.git/
Fetching changes...
Created fresh repository.
From https://gitlab.com/XXX/YYY
* [new branch] 13-solve-testing-issues -> origin/13-solve-testing-issues
* [new branch] develop -> origin/develop
* [new branch] master -> origin/master
Checking out e61598d8 as 13-solve-testing-issues...
Skipping Git submodules setup
Checking cache for default...
Downloading cache.zip from https://storage.googleapis.com/gitlab-com-runners-cache/project/XYZ/default
Successfully extracted cache
$ npm install --quiet
npm WARN read-shrinkwrap This version of npm is compatible with lockfileVersion@1, but npm-shrinkwrap.json was generated for lockfileVersion@0. I'll try to do my best with it!
> ngrx@2.0.1 postinstall /builds/XXX/YYY/node_modules/ngrx
> node postinstall.js
npm WARN ajv-keywords@3.4.0 requires a peer of ajv@^6.9.1 but none is installed. You must install peer dependencies yourself.
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.4 (node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.4: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})
npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.7 (node_modules/@angular/compiler-cli/node_modules/fsevents):
npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.7: wanted {"os":"darwin","arch":"any"} (current: {"os":"linux","arch":"x64"})
added 4 packages from 2 contributors and audited 45321 packages in 15.393s
found 27 vulnerabilities (2 low, 5 moderate, 20 high)
run `npm audit fix` to fix them, or `npm audit` for details
$ npm run build-prod
> YYY@0.1.0 build-prod /builds/XXX/YYY
> ng build --prod
Date: 2019-04-17T18:35:40.652Z
Hash: b0ba2a53437bf05b46d4
Time: 13104ms
chunk {0} runtime.26209474bfa8dc87a77c.js (runtime) 1.41 kB [entry] [rendered]
chunk {1} main.01ecbc0fcff9207e8cde.js (main) 128 bytes [initial] [rendered]
chunk {2} polyfills.a723c36635c3a098c2aa.js (polyfills) 130 bytes [initial] [rendered]
chunk {3} styles.6c94e29121bf3425375a.css (styles) 132 kB [initial] [rendered]
chunk {scripts} scripts.9aa141af6e0119c2bcf8.js (scripts) 581 kB [entry] [rendered]
ERROR in Error during template compile of 'AppModule'
Function calls are not supported in decorators but 'StoreModule' was called.
node_modules/@ngrx/store/src/ng2.d.ts(1,10): error TS2305: Module '"../../../@angular/core/core"' has no exported member 'OpaqueToken'.
src/app/app.reducer.ts(1,10): error TS2305: Module '"../../node_modules/@ngrx/store"' has no exported member 'ActionReducerMap'.
src/app/app.reducer.ts(1,28): error TS2305: Module '"../../node_modules/@ngrx/store"' has no exported member 'createFeatureSelector'.
src/app/app.reducer.ts(1,51): error TS2305: Module '"../../node_modules/@ngrx/store"' has no exported member 'createSelector'.
src/app/app.module.ts(42,21): error TS2339: Property 'forRoot' does not exist on type 'typeof StoreModule'.
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! YYY@0.1.0 build-prod: `ng build --prod`
npm ERR! Exit status 1
npm ERR!
npm ERR! Failed at the YYY@0.1.0 build-prod script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.
npm ERR! A complete log of this run can be found in:
npm ERR! /root/.npm/_logs/2019-04-17T18_35_40_678Z-debug.log
ERROR: Job failed: exit code 1
我对 angular 和 gitlab 还很陌生.你知道为什么会出错，或者如何找到我的问题?
I'm quite new with angular and gitlab. Do you see why can be wrong, or how to find my issue?
编辑这是我当前的 tsconfig 文件:
EDIT Here is my current tsconfig file:
{
"compileOnSave": false,
"compilerOptions": {
"baseUrl": "./",
"outDir": "./dist/out-tsc",
"sourceMap": true,
"declaration": false,
"module": "es2015",
"moduleResolution": "node",
"emitDecoratorMetadata": true,
"experimentalDecorators": true,
"target": "es5",
"typeRoots": [
"node_modules/@types"
],
"lib": [
"es2018",
"dom"
]
},
"angularCompilerOptions":{
"skipTemplateCodegen": false,
"strictMetadataEmit": false,
}
}
编辑 2这是我的 app.module.ts:
EDIT 2 Here is my app.module.ts:
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { HttpClientModule } from '@angular/common/http';
import { BrowserModule } from '@angular/platform-browser';
import { BrowserAnimationsModule } from '@angular/platform-browser/animations';
import { LocationStrategy, PathLocationStrategy } from '@angular/common';
import { AppRoutes } from './app.routes';
import { AppComponent } from './app.component';
import { AppProfileComponent } from './app.profile.component';
import { AppMenuComponent, AppSubMenuComponent } from './app.menu.component';
import { AppBreadcrumbComponent } from './app.breadcrumb.component';
import { AppTopBarComponent } from './app.topbar.component';
import { AppFooterComponent } from './app.footer.component';
import { BreadcrumbService } from './breadcrumb.service';
import { LayoutModule } from './layout/layout.module';
import { BeersModule } from './beers/beers.module';
import { AngularFireModule } from '@angular/fire';
import { environment } from '../environments/environment';
import { AngularFireAuthModule } from '@angular/fire/auth';
import { PrimeNgModule } from './primeng/primeng.module';
import { StoreModule } from '@ngrx/store';
import {reducers} from './app.reducer';
@NgModule({
imports: [
BrowserModule,
FormsModule,
AppRoutes,
HttpClientModule,
BrowserAnimationsModule,
LayoutModule,
BeersModule,
AngularFireModule.initializeApp(environment.firebase),
AngularFireAuthModule,
PrimeNgModule,
StoreModule.forRoot(reducers)
],
declarations: [
AppComponent,
AppMenuComponent,
AppSubMenuComponent,
AppProfileComponent,
AppBreadcrumbComponent,
AppTopBarComponent,
AppFooterComponent,
],
providers: [
{ provide: LocationStrategy, useClass: PathLocationStrategy },
BreadcrumbService
],
bootstrap: [AppComponent]
})
export class AppModule { }
编辑
我将 yml 文件更改为具有 node: latest.
I changed my yml file to have node: latest.
现在我有不同的错误:
推荐答案
我无法准确找出您的问题，但是关于装饰器不支持函数调用，在导出的模块中我们可以制作:
I can't figure out your issue exactly, but about function calls are not supported in decorators, at the exported module we can make:
@NgModule({
declarations: [...],
imports: [
...
],
providers: [...],
bootstrap: [...]
})
export class AppModule { }
@NgModule({})
export class ToSpaceAppModule {
static forRoot(): ModuleWithProviders {
const providers = [];
return {
ngModule: AppModule,
providers
};
}
}
'某处'
import { ToSpaceAppModule } from '../src/app/app.module';
export function fromSpaceFactory() {
return import('../src/app/app.module').then(m => m.ToSpaceAppModule );
}
@NgModule({
declarations: [...],
imports: [
...
ToSpaceAppModule
],
providers: [
{
provide: ToSpaceAppModule ,
useFactory: fromSpaceFactory
}
],
bootstrap: [...]
})
export class AppModule { }
这篇关于如何解决“装饰器不支持函数调用，但调用了‘StoreModule’."的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
