我正在尝试向我们的应用程序添加i18n支持,并按照https://angular.io/guide/i18n中所述并通过https://angular.io/generated/zips/i18n/i18n.zip进行演示的步骤
在该示例中,一切正常,包括调用
ng xi18n
但是,在我们的项目中,每当我尝试从源中提取i18n密钥时,都会收到以下错误消息:
npm run extract
在“ AppModule”函数调用的模板编译期间发生错误时出现错误 装饰器中不支持,但“ ZisAuthenticationModule”为 叫。
起初,我认为构建和启动应用程序可以正常工作:
npm run build
npm run build:de
npm run build:fr
npm run start
npm run start:fr
一切正常,除了我显然忘记将"aot": true
条目添加到angular.json
中的所有那些配置中。添加这些内容后,即使构建它仍然可以正常运行(并且始终将AOT设置为true),我现在都无法再运行我的应用程序。
我到处搜索Google,并在github和stackoverflow上找到了各种文章,但没有找到任何对我有帮助的东西。
我尝试执行类似的错误
ng build --configuration production
当environment.prod.ts
文件缺少变量keycloakClientId
时。但是,现在所有环境文件都包含此变量,所以我没有主意。
有人能指出我正确的方向吗?
这是我的文件:
package.json
{
"name": "zis-angebot-frontend",
"version": "0.0.0",
"license": "MIT",
"scripts": {
"start": "ng serve --configuration local --proxy-config proxy.conf.json --hmr --port 4201",
"start:fr": "ng serve --configuration local-fr --proxy-config proxy.conf.json --hmr --port 4201",
"start:it": "ng serve --configuration local-it --proxy-config proxy.conf.json --hmr --port 4201",
"extract": "ng xi18n --output-path locale",
"build": "npm run clean && npm run build:de && npm run build:fr && npm run build:it",
"build:de": "ng build --configuration local",
"build:fr": "ng build --configuration local-fr",
"build:it": "ng build --configuration local-it",
"clean": "rimraf \"dist/**\"",
"ng": "ng",
"test": "ng test",
"lint": "ng lint",
"e2e": "ng e2e"
},
"private": true,
"dependencies": {
"@angular/animations": "6.0.0",
"@angular/common": "6.0.0",
"@angular/compiler": "6.0.0",
"@angular/core": "6.0.0",
"@angular/forms": "6.0.0",
"@angular/http": "6.0.0",
"@angular/platform-browser": "6.0.0",
"@angular/platform-browser-dynamic": "6.0.0",
"@angular/router": "6.0.0",
"@fortawesome/fontawesome": "^1.1.6",
"@fortawesome/fontawesome-free-solid": "^5.0.11",
"core-js": "^2.5.4",
"moment": "^2.22.2",
"moment-range": "^4.0.1",
"rxjs": "6.1.0",
"rxjs-compat": "^6.0.0",
"zis-common-lib": "^1.2.17-0",
"zone.js": "^0.8.24"
},
"devDependencies": {
"@angular-devkit/build-angular": "~0.5.0",
"@angular/cli": "^6.0.0",
"@angular/compiler-cli": "6.0.0",
"@angular/language-service": "6.0.0",
"@angularclass/hmr": "^2.1.3",
"@types/jasmine": "~2.8.6",
"@types/jasminewd2": "~2.0.3",
"@types/webpack-env": "^1.13.6",
"codelyzer": "~4.2.1",
"jasmine-core": "~2.99.1",
"jasmine-spec-reporter": "~4.2.1",
"karma": "~1.7.1",
"karma-chrome-launcher": "~2.2.0",
"karma-coverage-istanbul-reporter": "~1.4.2",
"karma-jasmine": "~1.1.1",
"karma-jasmine-html-reporter": "^0.2.2",
"protractor": "~5.3.0",
"rimraf": "^2.6.2",
"ts-node": "~5.0.1",
"tslint": "~5.9.1",
"typescript": "~2.7.2"
}
}
angular.json
{
"$schema": "./node_modules/@angular-devkit/core/src/workspace/workspace-schema.json",
"version": 1,
"newProjectRoot": "projects",
"projects": {
"zis-angebot-frontend": {
"root": "",
"projectType": "application",
"prefix": "app",
"schematics": {
"@schematics/angular:component": {
"styleext": "scss"
}
},
"architect": {
"build": {
"builder": "@angular-devkit/build-angular:browser",
"options": {
"outputPath": "dist/zis-angebot-frontend/de/",
"index": "src/index.html",
"main": "src/main.ts",
"polyfills": "src/polyfills.ts",
"tsConfig": "src/tsconfig.app.json",
"preserveSymlinks": true,
"assets": [
{
"glob": "favicon.ico",
"input": "src",
"output": "/"
},
{
"glob": "**/*",
"input": "src/assets",
"output": "/assets"
}
],
"styles": [
{
"input": "src/styles.scss"
}
],
"scripts": []
},
"configurations": {
"production": {
"fileReplacements": [
{
"replace": "src/environments/environment.ts",
"with": "src/environments/environment.prod.ts"
}
],
"optimization": true,
"outputHashing": "all",
"sourceMap": false,
"extractCss": true,
"namedChunks": false,
"aot": true,
"extractLicenses": true,
"vendorChunk": false,
"buildOptimizer": true,
"outputPath": "dist/zis-angebot-frontend/de/",
"i18nLocale": "de"
},
"production-fr": {
"fileReplacements": [
{
"replace": "src/environments/environment.ts",
"with": "src/environments/environment.prod.ts"
}
],
"optimization": true,
"outputHashing": "all",
"sourceMap": false,
"extractCss": true,
"namedChunks": false,
"aot": true,
"extractLicenses": true,
"vendorChunk": false,
"buildOptimizer": true,
"outputPath": "dist/zis-angebot-frontend/fr/",
"i18nFile": "src/locale/messages.fr.xlf",
"i18nFormat": "xlf",
"i18nLocale": "fr",
"i18nMissingTranslation": "error"
},
"production-it": {
"fileReplacements": [
{
"replace": "src/environments/environment.ts",
"with": "src/environments/environment.prod.ts"
}
],
"optimization": true,
"outputHashing": "all",
"sourceMap": false,
"extractCss": true,
"namedChunks": false,
"aot": true,
"extractLicenses": true,
"vendorChunk": false,
"buildOptimizer": true,
"outputPath": "dist/zis-angebot-frontend/it/",
"i18nFile": "src/locale/messages.it.xlf",
"i18nFormat": "xlf",
"i18nLocale": "it",
"i18nMissingTranslation": "error"
},
"local": {
"fileReplacements": [
{
"replace": "src/environments/environment.ts",
"with": "src/environments/environment.local.ts"
}
],
"aot": true,
"outputPath": "dist/zis-angebot-frontend/de/",
"i18nLocale": "de"
},
"local-fr": {
"fileReplacements": [
{
"replace": "src/environments/environment.ts",
"with": "src/environments/environment.local.ts"
}
],
"aot": true,
"outputPath": "dist/zis-angebot-frontend/fr/",
"i18nFile": "src/locale/messages.fr.xlf",
"i18nFormat": "xlf",
"i18nLocale": "fr",
"i18nMissingTranslation": "error"
},
"local-it": {
"fileReplacements": [
{
"replace": "src/environments/environment.ts",
"with": "src/environments/environment.local.ts"
}
],
"aot": true,
"outputPath": "dist/zis-angebot-frontend/it/",
"i18nFile": "src/locale/messages.it.xlf",
"i18nFormat": "xlf",
"i18nLocale": "it",
"i18nMissingTranslation": "error"
}
}
},
"serve": {
"builder": "@angular-devkit/build-angular:dev-server",
"options": {
"browserTarget": "zis-angebot-frontend:build"
},
"configurations": {
"production": {
"browserTarget": "zis-angebot-frontend:build:production"
},
"production-fr": {
"browserTarget": "zis-angebot-frontend:build:production-fr"
},
"production-it": {
"browserTarget": "zis-angebot-frontend:build:production-it"
},
"local": {
"browserTarget": "zis-angebot-frontend:build:local"
},
"local-fr": {
"browserTarget": "zis-angebot-frontend:build:local-fr"
},
"local-it": {
"browserTarget": "zis-angebot-frontend:build:local-it"
}
}
},
"extract-i18n": {
"builder": "@angular-devkit/build-angular:extract-i18n",
"options": {
"browserTarget": "zis-angebot-frontend:build"
}
},
"test": {
"builder": "@angular-devkit/build-angular:karma",
"options": {
"main": "src/test.ts",
"polyfills": "src/polyfills.ts",
"tsConfig": "src/tsconfig.spec.json",
"karmaConfig": "src/karma.conf.js",
"styles": [
{
"input": "styles.scss"
}
],
"scripts": [],
"assets": [
{
"glob": "favicon.ico",
"input": "src/",
"output": "/"
},
{
"glob": "**/*",
"input": "src/assets",
"output": "/assets"
}
]
}
},
"lint": {
"builder": "@angular-devkit/build-angular:tslint",
"options": {
"tsConfig": [
"src/tsconfig.app.json",
"src/tsconfig.spec.json"
],
"exclude": [
"**/node_modules/**"
]
}
}
}
},
"zis-angebot-frontend-e2e": {
"root": "e2e/",
"projectType": "application",
"architect": {
"e2e": {
"builder": "@angular-devkit/build-angular:protractor",
"options": {
"protractorConfig": "e2e/protractor.conf.js",
"devServerTarget": "zis-angebot-frontend:serve"
}
},
"lint": {
"builder": "@angular-devkit/build-angular:tslint",
"options": {
"tsConfig": "e2e/tsconfig.e2e.json",
"exclude": [
"**/node_modules/**"
]
}
}
}
}
}
}
app.module.ts
import {BrowserModule} from '@angular/platform-browser';
import {AppComponent} from './app.component';
import {ZugSucheComponent} from './zug-suche/zug-suche.component';
import {HttpClientModule} from '@angular/common/http';
import {ZugDetailComponent} from './zug-detail/zug-detail.component';
import {AppRoutingModule} from './app-routing.module';
import {TableModule} from 'primeng/table';
import {FormsModule} from "@angular/forms";
import {ZisAuthenticationModule, ZisComponentsModule} from "zis-common-lib";
import {RelativeZeitPipe} from "./zeit/relative-zeit-pipe";
import {ZisBahnhofComponent} from "./zug-detail/zuglauf/zis-bahnhof/zis-bahnhof.component";
import {ZisBetriebspunktComponent} from "./zug-detail/zuglauf/zis-betriebspunkt/zis-betriebspunkt.component";
import {ZuglaufComponent} from "./zug-detail/zuglauf/zuglauf.component";
import {NlsPipe} from "./nls/nls-pipe"
import {NgModule} from "@angular/core";
import {environment} from "../environments/environment";
@NgModule({
declarations: [
AppComponent,
ZugSucheComponent,
ZugDetailComponent,
ZuglaufComponent,
ZisBahnhofComponent,
ZisBetriebspunktComponent,
RelativeZeitPipe,
NlsPipe
],
imports: [
BrowserModule,
HttpClientModule,
AppRoutingModule,
TableModule,
FormsModule,
ZisAuthenticationModule.forRoot(environment.keycloakClientId),
ZisComponentsModule,
],
exports: [ZisBahnhofComponent],
bootstrap: [AppComponent]
})
export class AppModule {
}
environment.ts
export const environment = {
production: false,
hmr: false,
keycloakClientId: 'client-zis-angebot-dev'
};
environment.local.ts
export const environment = {
production: false,
hmr: false,
keycloakClientId: 'client-zis-angebot-local'
};
environment.prod.ts
export const environment = {
production: false,
hmr: false,
keycloakClientId: 'client-zis-angebot-prod'
};
zis-authentication.module.d.ts (来自导入的库)
import { ModuleWithProviders } from "@angular/core";
export declare class ZisAuthenticationModule {
constructor(parentModule: ZisAuthenticationModule);
static forRoot(clientId: string): ModuleWithProviders;
}