I migrated my angular 8.xx
project to angular 9.xx
and when I try to publish my library, it fails with below error
npm ERR! @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
is there anything changed in the angular 9
UPDATE ANGULAR 12
using the --configuration production
option while building the library fixed my issue
ng build --configuration production
Original answer:
using --prod
option while building the library fixed my issue
ng build yourLibraryName --prod
According to official Angular docs https://angular.io/guide/ivy#opting-out-of-ivy-in-version-9
it is better to opt out from Ivy compiler to use the older View Engine when building and publishing your library by adding this line:
enableIvy: false
to angularCompilerOptions in tsconfig.json file at the root of your library as can be seen below;
I've tried it after updating my Angular library to Angular version 9 and this one small change worked like a charm.
In my case none of the solutions above worked. I noticed however that in the package.json
of my library in the dist folder there is an newly added script (probably added because of 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"
}
SO here either remove/replace the prepublishOnly
script or publish using npm publish --ignore-scripts
While building my libraries with ng build --prod
and enableIvy = false
in tsconfig.lib.json
I was getting the same "prepublishOnly" script added to my workspace package.json
as Melchia had.
The reason why seems to be related to using a private repository via publishConfig/registry
in each library's package.json
, as stated in https://github.com/angular/angular/issues/37973#issuecomment-656136865
When building Angular libraries for publishing, use ng build --prod
, enableIvy = false
in library's tsconfig.json
and, if working with a private repository, npm publish --ignore-scripts
On Angular 12, while using:
ng build --configuration production
indeed solved the original issue for me, it also introduced a new one: the styles of my library component where completely missing.
I've solved this other problem by replacing:
"angularCompilerOptions": {
"enableIvy": false
}
with:
"angularCompilerOptions": {
"compilationMode": "partial"
}
in projects/my-library/tsconfig.lib.prod.json
Source: https://angular.io/guide/creating-libraries#building-libraries-with-ivy
In addition to adding the --prod
flag, if you're running on a really old version, you'll also need the following update to angular.json
:
"myproject": {
...
"architect": {
"build": {
...
"configurations": {
"production": {
"tsConfig": "projects/mypath/tsconfig.lib.prod.json"
}
}
},
with the content of that file being:
{
"extends": "./tsconfig.lib.json",
"angularCompilerOptions": {
"enableIvy": false
}
}
You can check if you're on such an old version if you still have the following lines in angular.json
:
"production": {
"project": "projects/tsmean/spinner/ng-package.prod.json"
}
In your angular.json
file, you have a build
object in your library tree. Inside build
, you have a configurations
object, that contains a production
object and probably a development
object too.
Inside build
object define a new property called defaultConfiguration
, and set the value: production
that match with the name of the production
property inside configurations
object.
Your angular.json
file should look like this:
"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"
},
...
}
Your tsconfig.lib.prod.json
should contains this object:
"angularCompilerOptions": {
"enableIvy": false
}
Finally, yo can execute ng build your-library-name
Adding
"compilationMode": "partial"
to
"angularCompilerOptions": {
}
Solved my problem
The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.