问题描述
我想体验 angular i18n (https://angular.io/guide/i18n#build-from-the-command-line)。 我可以用一种语言环境为我的应用程序提供服务,没关系。但是我无法调试应用程序,因为这是捆绑的。
我使用的是 Angular 12
问题 如何在普通开发人员模式下使用国际化 (i18n)(没有捆绑应用程序)?或者也许有一个选项可以在没有 i18n 的情况下进行配置,而使用 i18n 仅在生产模式下构建应用程序?
angular.json
{
"$schema": "./node_modules/@angular/cli/lib/config/schema.json","version": 1,"newProjectRoot": "projects","projects": {
"pomodoro-app": {
"projectType": "application","schematics": {
"@schematics/angular:component": {
"style": "scss"
},"@schematics/angular:application": {
"strict": true
}
},"root": "","sourceRoot": "src","prefix": "pom","i18n": {
"sourceLocale": "en-US","locales": {
"pl": {
"translation": "src/locale/messages.pl.xlf"
},"en": {
"translation": "src/locale/messages.en.xlf"
}
}
},"architect": {
"build": {
"builder": "@angular-devkit/build-angular:browser","options": {
"localize": true,"outputPath": "dist","index": "src/index.html","main": "src/main.ts","polyfills": "src/polyfills.ts","tsConfig": "tsconfig.app.json","assets": ["src/favicon.ico","src/assets"],"styles": ["src/styles/styles.scss"],"scripts": [],"aot": true,"optimization": {
"fonts": false
}
},"configurations": {
"production": {
"optimization": true,"sourceMap": false,"namedChunks": false,"extractLicenses": true,"vendorChunk": false,"buildOptimizer": true,"budgets": [
{...},{...}
],"fileReplacements": [...],"outputHashing": "all"
},"development": {
"buildOptimizer": false,"optimization": false,"vendorChunk": true,"extractLicenses": false,"sourceMap": true,"namedChunks": true
},"en": {
"localize": ["en"],"baseHref": "/en/"
},"pl": {
"localize": ["pl"],"baseHref": "/pl/"
}
},"defaultConfiguration": "production"
},"serve": {
"builder": "@angular-devkit/build-angular:dev-server","options": {
"browserTarget": "pomodoro-app:build"
},"configurations": {
"production": {
"browserTarget": "pomodoro-app:build:production"
},"en": {
"browserTarget": "pomodoro-app:build:en"
},"pl": {
"browserTarget": "pomodoro-app:build:pl"
}
},"defaultConfiguration": "development"
},"extract-i18n": {
"builder": "@angular-devkit/build-angular:extract-i18n","options": {
"browserTarget": "pomodoro-app:build"
}
},"test": {...}
}
}
}
},"defaultProject": "pomodoro-app","cli": {
"defaultCollection": "@ngrx/schematics"
}
}
附言 我检查了文档和现场示例 (https://angular.io/generated/live-examples/i18n/stackblitz.html),但找不到可以帮助我解决这个问题的内容。
解决方法
我找到了解决方案,angular.json 配置中的构建和服务部分存在问题:
这里是差异
...
"build": {
"configurations": {
"development-en": {
"buildOptimizer": false,"optimization": false,"vendorChunk": false,"extractLicenses": false,"sourceMap": true,"localize": ["en"],"baseHref": "/en/"
},"development-pl": {
"buildOptimizer": false,"localize": ["pl"],"baseHref": "/pl/"
},...
},...
"serve": {
...
"configurations": {
"development-en": {
"buildOptimizer": false,"baseHref": "/en/"
},"development-pl": {
"buildOptimizer": false,}