Angular 8: 使用i18n时,ng run会出现“项目目标不存在”的错误提示。

3
根据以下教程: https://angular-templates.io/tutorials/about/angular-internationalization-i18n-multi-language-apphttps://medium.com/@ismaestro/angular-7-example-app-with-angularcli-angular-universal-i18n-official-firebase-66deac2dc31e,我正在尝试构建并使用一个使用i18n作为国际化系统的Angular 8应用程序。
然而,当我尝试运行 npm build:ssr (参见下文)时,我收到了 An unhandled exception occurred: Project target does not exist. 的错误信息。
这里是 angular.json 文件的内容:
{
    "$schema": "./node_modules/@angular/cli/lib/config/schema.json",
    "version": 1,
    "newProjectRoot": "projects",
    "projects": {
        "boilerplate": {
            "root": "",
            "sourceRoot": "src",
            "projectType": "application",
            "architect": {
                "build": {
                    "builder": "@angular-devkit/build-angular:browser",
                    "options": {
                        "outputPath": "dist",
                        "index": "src/index.html",
                        "main": "src/main.ts",
                        "tsConfig": "tsconfig.app.json",
                        "polyfills": "src/polyfills.ts",
                        "assets": [
                            "src/assets",
                            "src/favicon.ico"
                        ],
                        "styles": [
                            "src/styles.scss"
                        ],
                        "scripts": []
                    },
                    "configurations": {
                        "en": {
                            "outputPath": "dist/browser/",
                            "baseHref": "/",
                            "i18nFile": "src/locale/messages.en.xlf",
                            "i18nFormat": "xlf",
                            "i18nLocale": "en",
                            "i18nMissingTranslation": "error",
                            "assets": [
                                {
                                    "glob": "**/*",
                                    "input": "src/assets/",
                                    "output": "/assets/",
                                    "ignore": [
                                        "base/*",
                                        "css/*",
                                        "js/*"
                                    ]
                                },
                                {
                                    "glob": "**/*",
                                    "input": "src/assets/base",
                                    "output": "/"
                                }
                            ]
                        },
                        "fr": {
                            "outputPath": "dist/browser/",
                            "baseHref": "/fr/",
                            "i18nFile": "src/locale/messages.fr.xlf",
                            "i18nFormat": "xlf",
                            "i18nLocale": "fr",
                            "i18nMissingTranslation": "error",
                            "assets": [
                                {
                                    "glob": "**/*",
                                    "input": "src/assets/",
                                    "output": "/assets/",
                                    "ignore": [
                                        "base/*",
                                        "css/*",
                                        "js/*"
                                    ]
                                },
                                {
                                    "glob": "**/*",
                                    "input": "src/assets/base",
                                    "output": "/"
                                }
                            ]
                        },
                        "production-en": {
                            "assets": [
                                {
                                    "glob": "**/*",
                                    "input": "src/assets/",
                                    "output": "/assets/",
                                    "ignore": [
                                        "base/*",
                                        "css/*",
                                        "js/*"
                                    ]
                                },
                                {
                                    "glob": "**/*",
                                    "input": "src/assets/base",
                                    "output": "/"
                                }
                            ],
                            "fileReplacements": [
                                {
                                    "replace": "src/environments/environment.ts",
                                    "with": "src/environments/environment.prod.ts"
                                }
                            ],
                            "optimization": true,
                            "outputHashing": "all",
                            "sourceMap": false,
                            "extractCss": true,
                            "namedChunks": false,
                            "extractLicenses": true,
                            "vendorChunk": false,
                            "budgets": [
                                {
                                    "type": "initial",
                                    "maximumWarning": "2mb",
                                    "maximumError": "5mb"
                                }
                            ],
                            "outputPath": "dist/browser/",
                            "baseHref": "/",
                            "i18nFile": "src/locale/messages.en.xlf",
                            "i18nFormat": "xlf",
                            "i18nLocale": "en",
                            "i18nMissingTranslation": "error"
                        },
                        "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,
                            "budgets": [
                                {
                                    "type": "initial",
                                    "maximumWarning": "2mb",
                                    "maximumError": "5mb"
                                }
                            ],
                            "outputPath": "dist/browser/fr/",
                            "baseHref": "/fr/",
                            "i18nFile": "src/locale/messages.fr.xlf",
                            "i18nFormat": "xlf",
                            "i18nLocale": "fr",
                            "i18nMissingTranslation": "error"
                        }
                    }
                },
                "serve": {
                    "builder": "@angular-devkit/build-angular:dev-server",
                    "options": {
                        "browserTarget": "boilerplate:build:production-en"
                    },
                    "configurations": {
                        "fr": {
                            "browserTarget": "boilerplate:build:production-fr"
                        },
                        "en": {
                            "browserTarget": "boilerplate:build:production-en"
                        }
                    }
                },
                "extract-i18n": {
                    "builder": "@angular-devkit/build-angular:extract-i18n",
                    "options": {
                        "browserTarget": "boilerplate:build"
                    }
                },
                "test": {
                    "builder": "@angular-devkit/build-angular:karma",
                    "options": {
                        "main": "src/test.ts",
                        "karmaConfig": "./karma.conf.js",
                        "polyfills": "src/polyfills.ts",
                        "tsConfig": "tsconfig.spec.json",
                        "scripts": [],
                        "styles": [
                            "src/styles.scss"
                        ],
                        "assets": [
                            "src/assets",
                            "src/favicon.ico"
                        ]
                    }
                },
                "lint": {
                    "builder": "@angular-devkit/build-angular:tslint",
                    "options": {
                        "tsConfig": [
                            "tsconfig.app.json",
                            "tsconfig.spec.json"
                        ],
                        "exclude": [
                            "**/node_modules/**"
                        ]
                    }
                }
            }
        },
        "boilerplate-e2e": {
            "root": "e2e",
            "sourceRoot": "e2e",
            "projectType": "application",
            "architect": {
                "e2e": {
                    "builder": "@angular-devkit/build-angular:protractor",
                    "options": {
                        "protractorConfig": "./protractor.conf.js",
                        "devServerTarget": "boilerplate:serve"
                    }
                },
                "lint": {
                    "builder": "@angular-devkit/build-angular:tslint",
                    "options": {
                        "tsConfig": [
                            "e2e/tsconfig.e2e.json"
                        ],
                        "exclude": [
                            "**/node_modules/**"
                        ]
                    }
                }
            }
        }
    },
    "defaultProject": "boilerplate",
    "schematics": {
        "@schematics/angular:component": {
            "prefix": "app",
            "styleext": "scss"
        },
        "@schematics/angular:directive": {
            "prefix": "app"
        }
    }
}

这是 package.json 的一部分:

"scripts": {
        "ng": "ng",
        "start": "ng serve",
        "build": "ng build",
        "lint": "ng lint boilerplate",

        "build:prod:en": "ng build --configuration=production-en",
        "build:prod:fr": "ng build --configuration=production-fr",
        "build:server:prod:en": "ng run boilerplate:server:production-en",
        "build:server:prod:fr": "ng run boilerplate:server:production-fr",
        "build:library": "ng build ngx-example-library",
        "build:client-and-server-bundles": "npm run build:prod:en && npm run build:prod:fr && npm run build:server:prod:en && npm run build:server:prod:fr",
        "webpack:server": "webpack --config webpack.server.config.js --progress --colors",
        "build:ssr": "npm run build:client-and-server-bundles && npm run webpack:server",
        "serve:ssr": "node dist/server"
    },

如我之前所述,我希望成功地运行我的Angular应用程序,并使用i18n。但是错误消息是:

[error] 错误:项目目标不存在。 在WorkspaceNodeModulesArchitectHost.getBuilderNameForTarget (/Users/user$ 在RunCommand.runSingleTarget (/Users/user/Desktop/Boilerplate/boilerpla$ 在RunCommand.runArchitectTarget (/Users/user/Desktop/Boilerplate/boiler$ 在RunCommand.run (/Users/user/Desktop/Boilerplate/boilerplate/node_modu$ 在RunCommand.validateAndRun (/Users/user/Desktop/Boilerplate/boilerplat$ 在process._tickCallback (internal/process/next_tick.js:43:7) 在Function.Module.runMain (internal/modules/cjs/loader.js:778:11) 在startup (internal/bootstrap/node.js:300:19) 在bootstrapNodeJSCore (internal/bootstrap/node.js:826:3)

如果有人已经遇到过相同的问题并能够解释我做错了什么?谢谢。


我有同样的问题。你有没有偶然解决它? - Philippe Corrèges
1
很遗憾,我没有找到任何解决方法。目前,我只在开发环境中开发我的项目,我会在生产环境中重试。也许这就是问题所在。 - phenric
5个回答

11

我发现了这个问题:

1)你缺少angular.json文件中的architect配置。

2)在你的browserTarget存在问题。该目标必须指向项目,而不是Angular。

enter image description here

1)请将以下行添加到angular.json文件=>project=>{{您的项目名称}}=>achitect中(记得将“{{项目名称}}”替换为您的项目名称)。

        "server": {
          "builder": "@angular-devkit/build-angular:server",
          "options": {
            "outputPath": "dist/"{{project name}}"/server",
            "main": "server.ts",
            "tsConfig": "tsconfig.server.json"
          },
          "configurations": {
            "production": {
              "outputHashing": "media",
              "fileReplacements": [
                {
                  "replace": "src/environments/environment.ts",
                  "with": "src/environments/environment.prod.ts"
                }
              ],
              "sourceMap": false,
              "optimization": true
            }
          }
        },
        "serve-ssr": {
          "builder": "@nguniversal/builders:ssr-dev-server",
          "options": {
            "browserTarget": ""{{project name}}":build",
            "serverTarget": ""{{project name}}":server"
          },
          "configurations": {
            "production": {
              "browserTarget": ""{{project name}}":build:production",
              "serverTarget": ""{{project name}}":server:production"
            }
          }
        },
        "prerender": {
          "builder": "@nguniversal/builders:prerender",
          "options": {
            "browserTarget": ""{{project name}}":build:production",
            "serverTarget": ""{{project name}}":server:production",
            "routes": [
              "/"
            ]
          },
          "configurations": {
            "production": {}
          }
        }

2)确保您的package.json中有@nguniversal/express-engine@nguniversal/builders

npm i @nguniversal/express-engine @nguniversal/builders -D

我修改了文件,但仍然出现错误,还有其他建议吗?或者你只是从论坛复制粘贴解决方案? - fsalazar_sch

3

我已使用以下命令解决了它:

ng add @ionic/cordova-builders

Source: ionic forum


1
我需要下载Angular的新版本,命令为npm install @ionic/cordova-builders。 - vgpastor
这应该是被接受的答案。 - Armaan

1
我遇到了同样的问题,我的解决方法是添加“服务器”信息。
因为这一行
"build:client-and-server-bundles": "ng build --prod && ng run ngkol:server:production",
它试图运行ng run ngkol:server:production <<<
"projects": {
    "ngkol": {
        "projectType":  "application",
        "schematics":   {},
        "root":         "src",
        "sourceRoot":   "src",
        "prefix":       "app",
        "architect": {

            //2019-08-23 here goes your other info
            // build, serve,extract-i18n, options, lint, e2e, 

            "server": {
                "builder": "@angular-devkit/build-angular:server",
                "options": {
                    "outputPath": "dist/server",
                    "main": "src/main.server.ts",
                    "tsConfig": "src/tsconfig.server.json"
                },
                "configurations": {
                    "production": {
                        "fileReplacements": [{
                            "replace": "src/environments/environment.ts",
                            "with": "src/environments/environment.prod.ts"
                        }]
                    }
                }
            }

这是我的应用程序在运行 https://www.supercolegas.com/soon


0
我遇到了这个错误,因为我的项目名称与工作目录的名称略有不同。因此,当我像这个答案建议的那样输入“项目名称”时,我实际上是在输入项目目录的名称,而不是项目本身的名称。
项目名称可以在 angular.json 文件的 projects 对象中确认。

0

你可以尝试这个:

"server": {
    "builder": "@angular-devkit/build-angular:server",
    "options": {
        "outputPath": "dist/server",
        "main": "src/main.server.ts",
        "tsConfig": "src/tsconfig.server.json"  -------- Try to Replace tsconfig.server.json by tsconfig.app.json -------------
    },
    "configurations": {
        "production": {
            "fileReplacements": [{
                "replace": "src/environments/environment.ts",
                "with": "src/environments/environment.prod.ts"
            }]
        }
    }
}

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接