angular 9 库发布错误“尝试发布已由 Ivy 编译的包”

Posted 2023-02-22

【中文标题】angular 9 库发布错误“尝试发布已由 Ivy 编译的包”

【英文标题】：angular 9 library publish error "Trying to publish a package that has been compiled by Ivy"

【发布时间】：2020-05-30 17:00:53

【问题描述】：

我将我的angular 8.x.x 项目迁移到angular 9.x.x，当我尝试发布我的库时，它失败并出现以下错误

npm 错误！ @candiman/website@9.0.0 prepublishOnly: node --eval "console.error('ERROR: Trying to publish a package that has been compiled by Ivy. This is not allowed.\nPlease delete and rebuild the package, without compiling with Ivy, before attempting to publish.\n')" && exit 1

angular 9有什么变化

【问题讨论】：

这能回答你的问题吗？ How to compile a library without Ivy?

此问题与 Angular 9 迁移 @R.Richards 有关。另一个和正常有关，大部分人都会陷入这个问题，因为它会在迁移过程中弹出。

【参考方案1】：

更新 ANGULAR 12

在构建库时使用 --configuration production 选项解决了我的问题

ng build --configuration production

---

原答案：

在构建库时使用 --prod 选项解决了我的问题

ng build yourLibraryName --prod

【讨论】：

你的 --prod 配置是什么？

实际上 --prod 是一个传递给 angular cli 配置的标志，表示它是一个 prod 构建，所以不要做 aot/ivy 构建

是的 - 但它仍然必须在 angular.json 文件中为您的库设置为 production 配置 - 否则当您尝试运行时会收到错误消息，指出没有生产配置.

添加 --prod 有效，不，您不应该编写生产。环境配置和标志 --prod 是两个不同的东西

@AniruddhaDas 也一定要做ng build yourLibraryName --prod 之后 ng test --watch=false。 Ng test 还将编译您的库，然后出现错误：ERROR: Trying to publish a package that has been compiled by NGCC. This is not allowed.

【参考方案2】：

根据官方 Angular 文档https://angular.io/guide/ivy#opting-out-of-ivy-in-version-9

在构建和发布库时，最好通过添加以下行来退出 Ivy 编译器以使用旧版 View Engine：

enableIvy: false

到库根目录下 tsconfig.json 文件中的 angularCompilerOptions 如下所示；

在将我的 Angular 库更新到 Angular 9 后，我已经尝试过，这个小改动就像一个魅力。

【参考方案3】：

修复 Angular 12+ 缺少组件样式问题

在 Angular 12 上，使用时：

ng build --configuration production

确实为我解决了原来的问题，它还引入了一个新问题：我的库组件的样式完全丢失了。

我已经通过替换解决了另一个问题：

  "angularCompilerOptions": 
    "enableIvy": false
  

与：

  "angularCompilerOptions": 
    "compilationMode": "partial"
  

在projects/my-library/tsconfig.lib.prod.json

来源：https://angular.io/guide/creating-libraries#building-libraries-with-ivy

【参考方案4】：

就我而言，上述解决方案均无效。但是我注意到，在 dist 文件夹中我的库的 package.json 中有一个新添加的脚本（可能是因为 this 而添加的）：

"scripts": "prepublishOnly": "node --eval \"console.error('ERROR: Trying to publish a package that has been compiled by NGCC. This is not allowed.\\nPlease delete and rebuild the package, without compiling with NGCC, before attempting to publish.\\nNote that NGCC may have been run by importing this package into another project that is being built with Ivy enabled.\\n')\" && exit 1"

所以这里要么删除/替换 prepublishOnly 脚本，要么使用 npm publish --ignore-scripts 发布

【讨论】：

是不是因为你要发布一个以'ng-'开头的包？

【参考方案5】：

在使用tsconfig.lib.json 中的ng build --prod 和enableIvy = false 构建我的库时，我得到了与Melchia 相同的“prepublishOnly”脚本添加到我的工作区package.json。

原因似乎与在每个库的package.json 中通过publishConfig/registry 使用私有存储库有关，如https://github.com/angular/angular/issues/37973#issuecomment-656136865 中所述

在构建 Angular 库以进行发布时，请在库的 tsconfig.json 中使用 ng build --prod、enableIvy = false，如果使用私有存储库，请使用 npm publish --ignore-scripts

【参考方案6】：

除了添加--prod 标志之外，如果您运行的是非常旧的版本，您还需要对angular.json 进行以下更新：

    "myproject": 
      ...
      "architect": 
        "build": 
          ...
          "configurations": 
            "production": 
              "tsConfig": "projects/mypath/tsconfig.lib.prod.json"
            
          
        ,

该文件的内容为：

  "extends": "./tsconfig.lib.json",
  "angularCompilerOptions": 
    "enableIvy": false
  

如果您在angular.json 中仍有以下行，您可以检查您是否使用的是旧版本：

            "production": 
              "project": "projects/tsmean/spinner/ng-package.prod.json"
            

【参考方案7】：

添加

“编译模式”：“部分”

到

"angularCompilerOptions":

解决了我的问题

【讨论】：

这在Francesco's anser中已经提到了。

其实这是准确的解决方案，不需要像您引​​用的答案中讨论的那样进行长时间的修改

【参考方案8】：

在您的angular.json 文件中，您的库树中有一个build 对象。在build 内部，您有一个configurations 对象，其中包含一个production 对象，并且可能还包含一个development 对象。

在build 对象内定义一个名为defaultConfiguration 的新属性，并设置值：production，与production 对象内production 属性的名称匹配。

您的angular.json 文件应如下所示：

"architect": 
  build": 
    "builder": "@angular-devkit/build-ng-packagr:build",
    "options": 
      "tsConfig": "projects/ngx-custom-tooltip/tsconfig.lib.json",
      "project": "projects/ngx-custom-tooltip/ng-package.json"
    ,
    "configurations": 
      "production": 
        "tsConfig": "projects/ngx-custom-tooltip/tsconfig.lib.prod.json"
      ,
      "development": 
        "tsConfig": "projects/ngx-custom-tooltip/tsconfig.lib.json"
      
    ,
    "defaultConfiguration": "production"
  ,
  ...

你的tsconfig.lib.prod.json 应该包含这个对象：

"angularCompilerOptions": 
  "enableIvy": false

最后，你可以执行ng build your-library-name