添加 @angular/pwa 不适用于 Angular CLI答案

【问题标题】：Adding @angular/pwa not working on angular CLI添加 @angular/pwa 不适用于 Angular CLI
【发布时间】：2018-10-19 03:37:16
【问题描述】：

我正在尝试运行命令 ng add @angular/pwa --我的项目名称，以便我可以在我的 Angular 项目中实现服务工作者，但我返回的错误是“ add 命令需要在 Angular 项目中运行，但找不到项目定义。”如果有人能阐明我能做些什么来克服这个错误，那将不胜感激。我正在从 Angular CLI 1.49 版升级。我感觉它与 angularcli.json 文件有关，因为新版本使用 angular.json 文件。

当我尝试使用 ng serve 时，这也是一个例外： 工作区在使用前需要加载。错误：工作区在使用前需要加载

这是我的版本详情：

    / \   _ __   __ _ _   _| | __ _ _ __     / ___| |   |_ _|
   / △ \ | '_ \ / _` | | | | |/ _` | '__|   | |   | |    | |
  / ___ \| | | | (_| | |_| | | (_| | |      | |___| |___ | |
 /_/   \_\_| |_|\__, |\__,_|_|\__,_|_|       \____|_____|___|
                |___/


Angular CLI: 7.0.1
Node: 10.12.0
OS: darwin x64
Angular: 5.2.11
... animations, common, compiler, compiler-cli, core, forms
... http, platform-browser, platform-browser-dynamic
... platform-server, router

Package                      Version
------------------------------------------------------
@angular-devkit/architect    0.10.1
@angular-devkit/core         0.3.2
@angular-devkit/schematics   7.0.1
@angular/cli                 7.0.1
@ngtools/webpack             1.10.2
@schematics/angular          7.0.1
@schematics/update           0.10.1
rxjs                         5.5.12
typescript                   3.1.1
webpack                      3.11.0

【问题讨论】：

你必须在--project之后添加你的项目名称。
我试过了，我用的是我的项目名。
@angular/pwa 是用release of Angular 6 宣布的。我怀疑您必须先将 Angular 更新到 6+。

标签： angular angular-cli service-worker progressive-web-apps

【解决方案1】：

您对使用更新的angular.json 文件的新版本是正确的。请参阅以下有关更新 cli 的链接，它们应该会有所帮助：Angular Cli Error: The serve command requires to be run in an Angular project, but a project definition could not be found 和 https://github.com/angular/angular-cli/issues/12215#issuecomment-433593036

就我而言，我做了以下事情：

卸载cli：npm uninstall -g angular-cli
清除 npm 缓存：npm cache verify
重新安装angular cli：npm install -g @angular/cli@latest

安装 cli 并生成项目后，在项目目录中运行以下命令，其中 name 是 angular.json 文件中定义的应用程序名称：

ng add @angular/pwa --project name

请务必注意，name 是 angular.json 文件中列出的项目名称。在该文件中，您应该找到这样的指令："defaultProject": "app",。所以在我的情况下，它将是：

ng add @angular/pwa --project app

【讨论】：