Search code examples
javascriptangularnpmpnpm

Why my fresh angular-fire setup is broken in pnpm and working in npm when both package managers look at the same package.json file?

My following Angular-pnpm-angular_fire setup is broken.

With PNPM:

ng new pnpm-project --skip-install # create new project
cd pnpm-project
ng config cli.packageManager pnpm
ng generate environments
pnpm install
pnpm build # Working.

# Now and @angular/fire
ng add @angular/fire
ng build # Error

Error:

./node_modules/.pnpm/rxfire@6.0.3_firebase@9.17.1+rxjs@7.8.0/node_modules/rxfire/firestore/index.esm.js:137:40-53
Error: export '__spreadArray' (imported as '__spreadArray') was not found in 'tslib' (possible exports: __assign, __asyncDelegator, __asyncGenerator, __asyncValues, __await, __awaiter, __classPrivateFieldGet, __classPrivateFieldSet, __createBinding, __decorate, __exportStar, __extends, __generator, __importDefault, __importStar, __makeTemplateObject, __metadata, __param, __read, __rest, __spread, __spreadArrays, __values)

enter image description here

Now the same thing with NPM - working.

rm -rf node_modules
npm install
ng build

When both package managers look at the same package.json, why them produce results those are very much different? (I understand pnpm does some efficiency things. But I think that should not let it incorrectly resolve dependencies)

Solution

  • I checked the dependency requirements:

    Angular 15
- tslib ^2.3.0
- @angular/fire 7.5.0
  - tslib ^2.0.0
  - rxfire ^6.0.0
    - tslib ^1.9.0 || ~2.1.0

    Assuming there could me a dependency error, I done overriding the txfire>tslib version explicitly on package.json file

    package.json

    "pnpm": {
  "overrides":{
    "rxfire>tslib": "2.1.0"
  }
}

    This fixed the issue.

    Bug report: https://github.com/pnpm/pnpm/issues/6165