如何在 Ionic 4 中创建多应用程序项目？

Question

我尝试按照 ionic 文档在 Ionic 4 中创建一个简单的多应用程序项目，但它不起作用。

\n

https://ionicframework.com/docs/cli/configuration#multi-app-projects

\n

我的配置：

\n

\n
• 离子：v4.12.0
\n
• 角度 CLI：7.3.8
\n
• 节点：10.15.1
\n
• npm：6.9.0
\n
• Windows 10
\n

\n

我所做的：\n我创建了一个目录 \xe2\x80\x9cmonorepo\xe2\x80\x9d。\n在这个文件夹中，我创建了一个文件 ionic.config.json 并在其中粘贴了以下代码：

\n

{\n  "projects": {}\n}\n

\n

在 monorepo 中，我创建第二个目录：apps。\n在这个目录中（使用命令提示符），我编写命令：\nionic start "app1" --no-deps

\n

monorepo/ionic.config.json 已正确填充数据：

\n

{\n  "projects": {\n    "app1": {\n      "name": "app1",\n      "integrations": {},\n      "type": "angular",\n      "root": "apps\\\\app1"\n    }\n  }\n}\n

\n

但是当我尝试为服务器提供服务时，它不起作用。

\n

ionic serve --project app1返回此错误消息给我：

\n

> ng run app1:serve --host=0.0.0.0 --port=8100\n[ng] Project \'app1\' could not be found in workspace.\n[ng] Error: Project \'app1\' could not be found in workspace.\n[ng]     at Workspace.getProject (C:\\Users\\name\\AppData\\Roaming\\npm\\node_modules\\@angular\\cli\\node_modules\\@angular-devkit\\core\\src\\workspace\\workspace.js:93:19)\n[ng]     at Architect.getBuilderConfiguration (C:\\Users\\name\\AppData\\Roaming\\npm\\node_modules\\@angular\\cli\\node_modules\\@angular-devkit\\architect\\src\\architect-legacy.js:117:41)\n[ng]     at RunCommand.runSingleTarget (C:\\Users\\name\\AppData\\Roaming\\npm\\node_modules\\@angular\\cli\\models\\architect-command.js:160:45)\n[ng]     at RunCommand.runArchitectTarget (C:\\Users\\name\\AppData\\Roaming\\npm\\node_modules\\@angular\\cli\\models\\architect-command.js:201:35)\n[ng]     at RunCommand.run (C:\\Users\\name\\AppData\\Roaming\\npm\\node_modules\\@angular\\cli\\commands\\run-impl.js:14:25)\n[ng]     at RunCommand.validateAndRun (C:\\Users\\name\\AppData\\Roaming\\npm\\node_modules\\@angular\\cli\\models\\command.js:124:31)\n[ng]     at process._tickCallback (internal/process/next_tick.js:68:7)\n[ng]     at Function.Module.runMain (internal/modules/cjs/loader.js:745:11)\n[ng]     at startup (internal/bootstrap/node.js:283:19)\n[ng]     at bootstrapNodeJSCore (internal/bootstrap/node.js:743:3)\n\n[ERROR] ng has unexpectedly closed (exit code 1).\n\n        The Ionic CLI will exit. Please check any output above for error details.\n

\n

当我进入与错误相关的文件 (workspace.js:93:19) 并执行 console.log 时，我获得以下信息：

\n

{\n  "projects": {}\n}\n

\n

（显示的值在注释中）。

\n

projectName 变量似乎没问题。但可用的项目this._workspace.projects是 app 和 app-e2e ，这看起来很奇怪。

\n

我的问题是什么？\n我错过了什么？

\n

Answer 1

angular.json我成功地通过将everyapp关键字替换为我的离子项目的名称（此处为）来进行编译app1。

{
  "$schema": "./node_modules/@angular-devkit/core/src/workspace/workspace-schema.json",
  "version": 1,
  "defaultProject": "app1",                      <-- HERE
  "newProjectRoot": "projects",
  "projects": {
    "app1": {                                    <-- HERE
      "root": "",
      "sourceRoot": "src",
      "projectType": "application",
      "prefix": "app1",                          <-- NOT MANDATORY
      "schematics": {},
      "architect": {
        "build": { ... },
        "serve": {
          "builder": "@angular-devkit/build-angular:dev-server",
          "options": {
            "browserTarget": "app1:build"        <-- HERE
          },
   ...
}

我认为您应该重写每个离子项目的，而不是将多个角度应用程序放在一个项目结构中angular.json