teambit / bit-angular

Angular support for bit harmony
28 stars 3 forks source link

Build/Snap error @angular/compiler-cli/ngcc #45

Open v4ssi404 opened 2 years ago

v4ssi404 commented 2 years ago

Hello,

i am having trouble to build/snap a component.

bit build
✔ found 1 components to build
✔ running pre install subscribers
✔ deduping dependencies for installation
...bff0a3547e3c65c1ec5a5595f408827165a11 |  +28 +++
Packages are hard linked from the content-addressable store to the virtual store.
  Content-addressable store is at: /home/pixel/.pnpm-store/v3
  Virtual store is at:             ../../Library/Caches/Bit/capsules/b85bff0a3547e3c65c1ec5a5595f408827165a11/node_modules/.pnpm
...bff0a3547e3c65c1ec5a5595f408827165a11 | Progress: resolved 28, reused 28, downloaded 0, added 28, done
  -------------------------
✔ installing dependencies using pnpm
Cannot find module '@angular/compiler-cli/ngcc'
Require stack:
- /home/pixel/Library/Caches/Bit/capsules/5d80ac32eac50bb23e9f86198a31b2abb95aa781/teambit.angular_angular@0.0.60/dist/webpack-plugins/ngcc-processor.js
- /home/pixel/Library/Caches/Bit/capsules/5d80ac32eac50bb23e9f86198a31b2abb95aa781/teambit.angular_angular@0.0.60/dist/index.js
- /home/pixel/Library/Caches/Bit/capsules/5d80ac32eac50bb23e9f86198a31b2abb95aa781/teambit.angular_angular-v13@0.0.25/dist/angular-v13.main.runtime.js
- /home/pixel/.bvm/versions/0.0.766/bit-0.0.766/node_modules/@teambit/scope/dist/scope.main.runtime.js
- /home/pixel/.bvm/versions/0.0.766/bit-0.0.766/node_modules/@teambit/bit/dist/load-bit.js
- /home/pixel/.bvm/versions/0.0.766/bit-0.0.766/node_modules/@teambit/bit/dist/app.js
- /home/pixel/.bvm/versions/0.0.766/bit-0.0.766/node_modules/@teambit/bit/bin/bit

Here is my package.json, i deleted node_modules and package-lock.json and reinstalled all dep to be sure that i have all versions to 13.2.6

{
  "name": "angular-core-backend",
  "version": "0.0.0",
  "scripts": {
    "ng": "ng",
    "start": "ng serve --watch --poll=2000",
    "build": "ng build",
    "serve": "http-server ./dist/angular-core-backend -p 4201 --cors",
    "test": "echo \"There are no tests for now.\"",
    "lint": "ng lint",
    "lint-fix": "ng lint --fix",
    "e2e": "ng e2e",
    "format:write": "prettier src/**/*.{ts,json,md,scss,html} --write",
    "format:test": "prettier src/**/*.{ts,json,md,scss,html} --list-different",
    "postinstall": "bit compile && bit link"
  },
  "private": true,
  "husky": {
    "hooks": {
      "pre-commit": "pretty-quick --staged"
    }
  },
  "dependencies": {
    "@angular/animations": "13.2.6",
    "@angular/cdk": "^11.0.0",
    "@angular/common": "13.2.6",
    "@angular/compiler": "13.2.6",
    "@angular/core": "13.2.6",
    "@angular/forms": "13.2.6",
    "@angular/platform-browser": "13.2.6",
    "@angular/platform-browser-dynamic": "13.2.6",
    "@angular/router": "13.2.6",
    "@auth0/angular-jwt": "^3.0.0",
    "@ckeditor/ckeditor5-angular": "^1.1.2",
    "@ckeditor/ckeditor5-build-classic": "^15.0.0",
    "@ng-select/ng-select": "^8.0.0",
    "@ngx-translate/core": "^12.1.2",
    "@ngx-translate/http-loader": "^4.0.0",
    "@tinymce/tinymce-angular": "^4.2.4",
    "@types/lodash": "^4.14.149",
    "chart.js": "^2.9.4",
    "chartjs-chart-treemap": "0.2.3",
    "chartjs-plugin-datalabels": "^1.0.0",
    "dom-to-image": "^2.6.0",
    "exceljs": "^1.12.0",
    "file-saver": "^2.0.2",
    "flag-icons": "^6.1.1",
    "google-libphonenumber": "^3.2.27",
    "icheck-bootstrap": "^3.0.1",
    "intl-tel-input": "^17.0.3",
    "jspdf": "^2.3.1",
    "jspdf-autotable": "^3.5.14",
    "libphonenumber-js": "^1.9.50",
    "lodash": "^4.17.15",
    "mathjs": "^8.1.0",
    "ngx-bootstrap": "^5.1.2",
    "ngx-drag-drop": "^2.0.0",
    "ngx-intl-tel-input": "^3.1.3",
    "ngx-toastr": "^11.3.3",
    "rxjs": "~6.6.7",
    "tslib": "^2.0.0",
    "xss": "^1.0.9",
    "zone.js": "~0.11.4"
  },
  "devDependencies": {
    "@angular-devkit/build-angular": "13.2.6",
    "@angular-eslint/builder": "13.1.0",
    "@angular-eslint/eslint-plugin": "13.1.0",
    "@angular-eslint/eslint-plugin-template": "13.1.0",
    "@angular-eslint/schematics": "13.1.0",
    "@angular-eslint/template-parser": "13.1.0",
    "@angular/cli": "13.2.6",
    "@angular/compiler-cli": "13.2.6",
    "@angular/language-service": "13.2.6",
    "@types/jasmine": "~3.6.0",
    "@types/jasminewd2": "~2.0.3",
    "@types/node": "^12.11.1",
    "@typescript-eslint/eslint-plugin": "5.11.0",
    "@typescript-eslint/parser": "5.11.0",
    "eslint": "^8.2.0",
    "eslint-plugin-unused-imports": "^2.0.0",
    "http-server": "^0.12.1",
    "husky": "^3.0.9",
    "jasmine-core": "~3.6.0",
    "jasmine-spec-reporter": "~5.0.0",
    "karma": "~6.3.17",
    "karma-chrome-launcher": "~3.1.0",
    "karma-coverage-istanbul-reporter": "~3.0.2",
    "karma-jasmine": "~4.0.0",
    "karma-jasmine-html-reporter": "^1.5.0",
    "prettier": "^2.6.1",
    "pretty-quick": "^2.0.0",
    "protractor": "~7.0.0",
    "ts-node": "~7.0.0",
    "typescript": "~4.5.5"
  }
}

Any hint? ty

ocombe commented 2 years ago

Did you switch from pnpm to yarn at some point ? If so, you need to delete both the node modules and the aspect's root capsule (you can find its location with bit capsule list)

v4ssi404 commented 2 years ago

No i didn't. It's my first use of Bit, and i am doing the first setup into an already working project.

The command response is this one:

found 3 capsule(s) for workspace:  /home/pixel/PhpstormProjects/angular-core-backend
workspace capsules root-dir:       /home/pixel/Library/Caches/Bit/capsules/b85bff0a3547e3c65c1ec5a5595f408827165a11
scope's aspects capsules root-dir: /home/pixel/Library/Caches/Bit/capsules/5d80ac32eac50bb23e9f86198a31b2abb95aa781
use --json to get the list of all workspace capsule
ocombe commented 2 years ago

oh so your current project already has node modules installed with npm ?

v4ssi404 commented 2 years ago

Yes as you can see i am also not using bit install but i have added "postinstall": "bit compile && bit link" to my package.json

ocombe commented 2 years ago

Then this is why it is not working. In a bit workspace you need to use bit install because we install dependencies in a very specific way. If you have dependencies in your package.json they will also be installed when you run bit install

v4ssi404 commented 2 years ago

Ok, so this part of the docs does not apply to Angular env?

When using package managers directly If you choose not to use Bit to manage dependencies in the project, ensure to add bit compile && bit link to your package.json as >post-install scripts.

v4ssi404 commented 2 years ago

I deleted again package-lock.json and also node_modules dir, i removed "postinstall": "bit compile && bit link" and i have now used bit install. Same error but now i have a pnpm-lock.yaml file.

ocombe commented 2 years ago

Ok so there are a few things that can cause these issues:

The easiest way to make all of that work is to start from a fresh workspace using the workspace generator. Is there any reason why you want to use this existing workspace?

v4ssi404 commented 2 years ago

Ok ty, i will try with yarn, so basically i must not use npm install anymore? why yarn? just for knowledge.

This repo it is like a core/boiler plate where we would like to start projects from, of course into the new repos we would link bit packages instead of copypasting.

I was just playing around with Bit, in my mind i was just planning to create a "library" repo just for bit and then link them into the boilerplate repo, you think this is better?

What about this?

Ok, so this part of the docs does not apply to Angular env?

When using package managers directly If you choose not to use Bit to manage dependencies in the project, ensure to add bit compile && bit link to your package.json as >post-install scripts.

Thank you.