upgrade helix-front to Angular 13.3 #2114
Comments
ng update @angular/core@13 @angular/cli@13
The installed Angular CLI version is outdated.
Installing a temporary Angular CLI versioned 13.3.6 to perform the update.
✔ Package successfully installed.
Using package manager: 'npm'
Collecting installed dependencies...
Found 71 dependencies.
Fetching dependency metadata from registry...
Updating package.json with dependency @angular-devkit/build-angular @ "13.3.6" (was "12.2.17")...
Updating package.json with dependency @angular/cli @ "13.3.6" (was "12.2.17")...
Updating package.json with dependency @angular/compiler-cli @ "13.3.9" (was "12.2.16")...
Updating package.json with dependency typescript @ "4.6.4" (was "4.3.5")...
Updating package.json with dependency @angular/animations @ "13.3.9" (was "12.2.16")...
Updating package.json with dependency @angular/common @ "13.3.9" (was "12.2.16")...
Updating package.json with dependency @angular/compiler @ "13.3.9" (was "12.2.16")...
Updating package.json with dependency @angular/core @ "13.3.9" (was "12.2.16")...
Updating package.json with dependency @angular/forms @ "13.3.9" (was "12.2.16")...
Updating package.json with dependency @angular/platform-browser @ "13.3.9" (was "12.2.16")...
Updating package.json with dependency @angular/platform-browser-dynamic @ "13.3.9" (was "12.2.16")...
Updating package.json with dependency @angular/platform-server @ "13.3.9" (was "12.2.16")...
Updating package.json with dependency @angular/router @ "13.3.9" (was "12.2.16")...
UPDATE package.json (3319 bytes)
✔ Packages successfully installed.
** Executing migrations of package '@angular/cli' **
❯ Remove polyfills required only for Internet Explorer which is no longer supported.
UPDATE client/polyfills.ts (1969 bytes)
Migration completed.
❯ Remove no longer valid Angular schematic options from `angular.json`.
Migration completed.
❯ Remove deprecated options from 'angular.json' that are no longer present in v13.
UPDATE angular.json (3720 bytes)
Migration completed.
❯ Updating '.gitignore' to include '.angular/cache'.
UPDATE .gitignore (546 bytes)
Migration completed.
❯ Update library projects to be published in partial mode and removed deprecated options from ng-packagr configuration.
Migration completed.
** Executing migrations of package '@angular/core' **
❯ Migrates `[routerLink]=""` in templates to `[routerLink]="[]"` because these links are likely intended to route to the current page with updated fragment/query params.
Migration completed.
❯ In Angular version 13, the `teardown` flag in `TestBed` will be enabled by default.
This migration automatically opts out existing apps from the new teardown behavior.
UPDATE client/test.ts (1128 bytes)
Migration completed.
❯ As of Angular version 13, `entryComponents` are no longer necessary.
Migration completed. |
ng update @angular/material@13 --force
Using package manager: 'npm'
Collecting installed dependencies...
Found 71 dependencies.
Fetching dependency metadata from registry...
Package "@angular/flex-layout" has an incompatible peer dependency to "@angular/cdk" (requires "^12.0.0", would install "13.3.7").
Updating package.json with dependency @angular/cdk @ "13.3.7" (was "12.2.13")...
Updating package.json with dependency @angular/material @ "13.3.7" (was "12.2.13")...
UPDATE package.json (3317 bytes)
✔ Packages successfully installed.
** Executing migrations of package '@angular/cdk' **
❯ Updates the Angular CDK to v13.
Skipping migration for project helix-front-e2e. Unable to determine 'tsconfig.json' file in workspace config.
✓ Updated Angular CDK to version 13
UPDATE client/theme.scss (1414 bytes)
UPDATE client/app/cluster/cluster-list/cluster-list.component.scss (378 bytes)
UPDATE client/app/history/history-list/history-list.component.scss (255 bytes)
UPDATE client/app/instance/instance-list/instance-list.component.scss (274 bytes)
UPDATE client/app/resource/partition-list/partition-list.component.scss (331 bytes)
UPDATE client/app/resource/resource-detail/resource-detail.component.scss (223 bytes)
UPDATE client/app/shared/data-table/data-table.component.scss (295 bytes)
UPDATE client/app/shared/detail-header/detail-header.component.scss (841 bytes)
UPDATE client/app/shared/disabled-label/disabled-label.component.scss (372 bytes)
UPDATE client/app/shared/node-viewer/node-viewer.component.scss (550 bytes)
UPDATE client/app/shared/state-label/state-label.component.scss (413 bytes)
UPDATE client/app/workflow/workflow-dag/workflow-dag.component.scss (328 bytes)
UPDATE client/app/workflow/workflow-detail/workflow-detail.component.scss (362 bytes)
Migration completed.
** Executing migrations of package '@angular/material' **
❯ Updates Angular Material to v13.
Skipping migration for project helix-front-e2e. Unable to determine 'tsconfig.json' file in workspace config.
✓ Updated Angular Material to version 13
Migration completed. |
let's add a build target to help the migration locate the tsconfig for our e2e project. Here's the snippet from "helix-front-e2e": {
"root": "e2e",
"sourceRoot": "e2e",
"projectType": "application",
"architect": {
"build": {
"options": {
"tsConfig": "e2e/tsconfig.e2e.json"
}
},
"e2e": {
"builder": "@angular-devkit/build-angular:protractor",
"options": {
"protractorConfig": "./protractor.conf.js",
"devServerTarget": "helix-front:serve"
},
"configurations": {}
}
}
}
}, |
new peer dep warnings:@angular/flex-layout@12.0.0-beta.35 --> @angular/cdk@^12.0.0
@swimlane/ngx-graph@8.0.0-rc.2 --> @angular/animations@9.x || 10.x || 11.x || 12.x
@swimlane/ngx-graph@8.0.0-rc.2 --> @angular/common@9.x || 10.x || 11.x || 12.x
@swimlane/ngx-graph@8.0.0-rc.2 --> @angular/core@9.x || 10.x || 11.x || 12.x
@swimlane/ngx-graph@8.0.0-rc.2 --> @angular/cdk@9.x || 10.x || 11.x || 12.x
codelyzer@6.0.2 --> @angular/compiler@>=2.3.1 <13.0.0 || ^12.0.0-next || ^12.1.0-next || ^12.2.0-next
codelyzer@6.0.2 --> @angular/core@>=2.3.1 <13.0.0 || ^12.0.0-next || ^12.1.0-next || ^12.2.0-next
ngx-vis@3.1.0 --> keycharm@^0.2.0
rxjs-tslint@0.1.8 --> tslint@^5.0.0
tsickle@0.43.0 --> typescript@~4.3 |
npm i tsickle@0.46.1Ah, it looks like "tsickle": "github:angular/tsickle#8f11720637b7bb1c7b0e271e16bebbcdc8189617",We see this errror: npm i
> tsickle@0.46.1 prepack /.npm/_cacache/tmp/git-clone-37732a43
> yarn run clean && yarn run build && yarn run test
yarn run v1.22.1
$ rm -r out
rm: out: No such file or directory
error Command failed with exit code 1.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.
npm ERR! premature close
npm ERR! A complete log of this run can be found in:
npm ERR! /.npm/_logs/2022-05-24T05_37_52_930Z-debug.logLet's try installing with yarn classic instead: yarn
yarn install v1.22.1
warning package-lock.json found. Your project contains lock files generated by tools other than Yarn. It is advised not to mix package managers in order to avoid resolution inconsistencies caused by unsynchronized lock files. To clear this warning, remove package-lock.json.
[1/5] 🔍 Validating package.json...
[2/5] 🔍 Resolving packages...
warning @swimlane/ngx-graph > core-js@2.6.12: core-js@<3.4 is no longer maintained and not recommended for usage due to the number of issues. Because of the V8 engine whims, feature detection in old core-js versions could cause a slowdown up to 100x even if nothing is polyfilled. Please, upgrade your dependencies to the actual version of core-js.
warning @swimlane/ngx-graph > mdast@3.0.0: `mdast` was renamed to `remark`
warning @swimlane/ngx-graph > mermaid > @braintree/sanitize-url@3.1.0: Potential XSS vulnerability patched in v6.0.0.
warning @angular-devkit/build-angular > stylus > css > source-map-resolve@0.6.0: See https://github.com/lydell/source-map-resolve#deprecated
warning tslint@6.1.3: TSLint has been deprecated in favor of ESLint. Please see https://github.com/palantir/tslint/issues/4534 for more information.
[3/5] 🚚 Fetching packages...
error An unexpected error occurred: "https://registry.yarnpkg.com/event-stream/-/event-stream-3.3.6.tgz: Request failed \"404 Not Found\"".
info If you think this is a bug, please open a bug report with the information provided in "/helix/helix-front/yarn-error.log".
info Visit https://yarnpkg.com/en/docs/cli/install for documentation about this command.Ah, so we fail for a different reason. Progress? yarnpkg/yarn#7483 which points to https://blog.npmjs.org/post/180565383195/details-about-the-event-stream-incident Okay, let's figure out where we use the insecure event-stream library and remove it. https://stackoverflow.com/questions/31923195/how-to-find-reverse-dependencies-on-npm-package find ./node_modules/ -name package.json | xargs grep event-stream |
find ./node_modules/ -name package.json | xargs grep event-stream
./node_modules//map-stream/package.json: "/event-stream"
./node_modules//map-stream/package.json: "event-stream": "~2.1",
./node_modules//split/package.json: "/event-stream"
./node_modules//split/package.json: "event-stream": "~3.0.2",
./node_modules//duplexer/package.json: "/event-stream",
./node_modules//from/package.json: "/event-stream"
./node_modules//through/package.json: "/event-stream",
./node_modules//readdirp/examples/package.json: "event-stream": "~3.0.7"
./node_modules//ps-tree/package.json: "event-stream": "~3.3.0"
./node_modules//pause-stream/package.json: "/event-stream"
./node_modules//stream-combiner/package.json: "/event-stream"
./node_modules//stream-combiner/package.json: "event-stream": "~3.0.7",Okay, who requires these packages? throughnpm ls through
helix-front@1.2.1 /Users/m/workspace/helix/helix-front
├─┬ @angular-devkit/build-angular@13.3.6
│ └─┬ inquirer@8.2.0
│ └── through@2.3.8
├─┬ codelyzer@6.0.2
│ └─┬ cssauron@1.4.0
│ └── through@2.3.8 deduped
└─┬ nodemon@1.11.0
└─┬ ps-tree@1.1.0
└─┬ event-stream@3.3.4
├─┬ pause-stream@0.0.11
│ └── through@2.3.8 deduped
├─┬ split@0.3.3
│ └── through@2.3.8 deduped
└── through@2.3.8 dedupedps-tree npm ls ps-tree
helix-front@1.2.1 /Users/m/workspace/helix/helix-front
└─┬ nodemon@1.11.0
└── ps-tree@1.1.0
# stream-combiner
npm ls stream-combiner
helix-front@1.2.1 /Users/m/workspace/helix/helix-front
└─┬ nodemon@1.11.0
└─┬ ps-tree@1.1.0
└─┬ event-stream@3.3.4
└── stream-combiner@0.0.4map-streamnpm ls map-stream
helix-front@1.2.1 /Users/m/workspace/helix/helix-front
└─┬ nodemon@1.11.0
└─┬ ps-tree@1.1.0
└─┬ event-stream@3.3.4
└── map-stream@0.1.0split npm ls split
helix-front@1.2.1 /Users/m/workspace/helix/helix-front
└─┬ nodemon@1.11.0
└─┬ ps-tree@1.1.0
└─┬ event-stream@3.3.4
└── split@0.3.3same story with duplexer npm ls duplexer
helix-front@1.2.1 /Users/m/workspace/helix/helix-front
└─┬ nodemon@1.11.0
└─┬ ps-tree@1.1.0
└─┬ event-stream@3.3.4
├── duplexer@0.1.1
└─┬ stream-combiner@0.0.4
└── duplexer@0.1.1 Is actually a dep of event-stream. We can safely ignore this one then. from npm ls from
helix-front@1.2.1 /Users/m/workspace/helix/helix-front
└─┬ nodemon@1.11.0
└─┬ ps-tree@1.1.0
└─┬ event-stream@3.3.4
└── from@0.1.7readdirpOnly the examples, so maybe we can ignore this one?
npm ls readdirp
helix-front@1.2.1 /Users/m/workspace/helix/helix-front
├─┬ @angular-devkit/build-angular@13.3.6
│ ├─┬ sass@1.49.9
│ │ └─┬ chokidar@3.5.3
│ │ └── readdirp@3.6.0
│ └─┬ webpack-dev-server@4.7.3
│ └─┬ chokidar@3.5.3
│ └── readdirp@3.6.0
├─┬ @angular/compiler-cli@13.3.9
│ └─┬ chokidar@3.5.3
│ └── readdirp@3.6.0
├─┬ karma@6.3.20
│ └─┬ chokidar@3.5.3
│ └── readdirp@3.6.0
├─┬ nodemon@1.11.0
│ └─┬ chokidar@1.7.0
│ └── readdirp@2.1.0
└─┬ sass@1.51.0
└─┬ chokidar@3.5.3
└── readdirp@3.6.0pause-streamnpm ls pause-stream
helix-front@1.2.1 /Users/m/workspace/helix/helix-front
└─┬ nodemon@1.11.0
└─┬ ps-tree@1.1.0
└─┬ event-stream@3.3.4
└── pause-stream@0.0.11 |
|
This suggests that npm i nodemon@2.0.16and again, install deps with yarn v1: yarnGood news, the Full log: yarn
yarn install v1.22.1
warning package-lock.json found. Your project contains lock files generated by tools other than Yarn. It is advised not to mix package managers in order to avoid resolution inconsistencies caused by unsynchronized lock files. To clear this warning, remove package-lock.json.
[1/5] 🔍 Validating package.json...
[2/5] 🔍 Resolving packages...
warning @swimlane/ngx-graph > core-js@2.6.12: core-js@<3.4 is no longer maintained and not recommended for usage due to the number of issues. Because of the V8 engine whims, feature detection in old core-js versions could cause a slowdown up to 100x even if nothing is polyfilled. Please, upgrade your dependencies to the actual version of core-js.
warning @swimlane/ngx-graph > mdast@3.0.0: `mdast` was renamed to `remark`
warning @swimlane/ngx-graph > mermaid > @braintree/sanitize-url@3.1.0: Potential XSS vulnerability patched in v6.0.0.
warning @angular-devkit/build-angular > stylus > css > source-map-resolve@0.6.0: See https://github.com/lydell/source-map-resolve#deprecated
warning tslint@6.1.3: TSLint has been deprecated in favor of ESLint. Please see https://github.com/palantir/tslint/issues/4534 for more information.
[3/5] 🚚 Fetching packages...
info esbuild-darwin-arm64@0.14.22: The CPU architecture "x64" is incompatible with this module.
info "esbuild-darwin-arm64@0.14.22" is an optional dependency and failed compatibility check. Excluding it from installation.
info esbuild-android-arm64@0.14.22: The platform "darwin" is incompatible with this module.
info "esbuild-android-arm64@0.14.22" is an optional dependency and failed compatibility check. Excluding it from installation.
info esbuild-android-arm64@0.14.22: The CPU architecture "x64" is incompatible with this module.
info esbuild-linux-arm@0.14.22: The platform "darwin" is incompatible with this module.
info "esbuild-linux-arm@0.14.22" is an optional dependency and failed compatibility check. Excluding it from installation.
info esbuild-linux-arm@0.14.22: The CPU architecture "x64" is incompatible with this module.
info esbuild-freebsd-arm64@0.14.22: The platform "darwin" is incompatible with this module.
info "esbuild-freebsd-arm64@0.14.22" is an optional dependency and failed compatibility check. Excluding it from installation.
info esbuild-freebsd-arm64@0.14.22: The CPU architecture "x64" is incompatible with this module.
info esbuild-linux-32@0.14.22: The platform "darwin" is incompatible with this module.
info "esbuild-linux-32@0.14.22" is an optional dependency and failed compatibility check. Excluding it from installation.
info esbuild-linux-32@0.14.22: The CPU architecture "x64" is incompatible with this module.
info esbuild-linux-ppc64le@0.14.22: The platform "darwin" is incompatible with this module.
info "esbuild-linux-ppc64le@0.14.22" is an optional dependency and failed compatibility check. Excluding it from installation.
info esbuild-linux-ppc64le@0.14.22: The CPU architecture "x64" is incompatible with this module.
info esbuild-linux-riscv64@0.14.22: The platform "darwin" is incompatible with this module.
info "esbuild-linux-riscv64@0.14.22" is an optional dependency and failed compatibility check. Excluding it from installation.
info esbuild-linux-riscv64@0.14.22: The CPU architecture "x64" is incompatible with this module.
info esbuild-linux-s390x@0.14.22: The platform "darwin" is incompatible with this module.
info "esbuild-linux-s390x@0.14.22" is an optional dependency and failed compatibility check. Excluding it from installation.
info esbuild-linux-s390x@0.14.22: The CPU architecture "x64" is incompatible with this module.
info esbuild-linux-64@0.14.22: The platform "darwin" is incompatible with this module.
info "esbuild-linux-64@0.14.22" is an optional dependency and failed compatibility check. Excluding it from installation.
info esbuild-linux-mips64le@0.14.22: The platform "darwin" is incompatible with this module.
info "esbuild-linux-mips64le@0.14.22" is an optional dependency and failed compatibility check. Excluding it from installation.
info esbuild-linux-mips64le@0.14.22: The CPU architecture "x64" is incompatible with this module.
info esbuild-sunos-64@0.14.22: The platform "darwin" is incompatible with this module.
info "esbuild-sunos-64@0.14.22" is an optional dependency and failed compatibility check. Excluding it from installation.
info esbuild-openbsd-64@0.14.22: The platform "darwin" is incompatible with this module.
info "esbuild-openbsd-64@0.14.22" is an optional dependency and failed compatibility check. Excluding it from installation.
info esbuild-netbsd-64@0.14.22: The platform "darwin" is incompatible with this module.
info "esbuild-netbsd-64@0.14.22" is an optional dependency and failed compatibility check. Excluding it from installation.
info esbuild-freebsd-64@0.14.22: The platform "darwin" is incompatible with this module.
info "esbuild-freebsd-64@0.14.22" is an optional dependency and failed compatibility check. Excluding it from installation.
info esbuild-windows-arm64@0.14.22: The platform "darwin" is incompatible with this module.
info "esbuild-windows-arm64@0.14.22" is an optional dependency and failed compatibility check. Excluding it from installation.
info esbuild-windows-arm64@0.14.22: The CPU architecture "x64" is incompatible with this module.
info esbuild-windows-32@0.14.22: The platform "darwin" is incompatible with this module.
info "esbuild-windows-32@0.14.22" is an optional dependency and failed compatibility check. Excluding it from installation.
info esbuild-windows-32@0.14.22: The CPU architecture "x64" is incompatible with this module.
info esbuild-linux-arm64@0.14.22: The platform "darwin" is incompatible with this module.
info "esbuild-linux-arm64@0.14.22" is an optional dependency and failed compatibility check. Excluding it from installation.
info esbuild-linux-arm64@0.14.22: The CPU architecture "x64" is incompatible with this module.
info esbuild-windows-64@0.14.22: The platform "darwin" is incompatible with this module.
info "esbuild-windows-64@0.14.22" is an optional dependency and failed compatibility check. Excluding it from installation.
[4/5] 🔗 Linking dependencies...
warning "@swimlane/ngx-graph > @swimlane/docspa-core@8.0.1" has incorrect peer dependency "@angular/common@^12.0.5".
warning "@swimlane/ngx-graph > @swimlane/docspa-core@8.0.1" has incorrect peer dependency "@angular/core@^12.0.5".
warning "@swimlane/ngx-graph > @swimlane/docspa-core@8.0.1" has incorrect peer dependency "@angular/elements@^12.0.5".
warning "@swimlane/ngx-graph > @swimlane/docspa-core@8.0.1" has unmet peer dependency "path-browserify@^1.0.0".
warning "@swimlane/ngx-graph > @swimlane/docspa-core@8.0.1" has unmet peer dependency "url@^0.11.0".
warning "@swimlane/ngx-graph > @swimlane/docspa-stackblitz@8.0.0" has incorrect peer dependency "@angular/common@^10.0.0".
warning "@swimlane/ngx-graph > @swimlane/docspa-stackblitz@8.0.0" has incorrect peer dependency "@angular/core@^10.0.0".
warning "@swimlane/ngx-graph > @swimlane/docspa-stackblitz@8.0.0" has incorrect peer dependency "@swimlane/docspa-core@^6.0.0".
warning " > ngx-vis@3.1.0" has incorrect peer dependency "keycharm@^0.2.0".
warning "ngx-vis > vis-timeline@7.5.1" has unmet peer dependency "propagating-hammerjs@^1.4.0 || ^2.0.0".
warning " > codelyzer@6.0.2" has incorrect peer dependency "@angular/compiler@>=2.3.1 <13.0.0 || ^12.0.0-next || ^12.1.0-next || ^12.2.0-next".
warning " > codelyzer@6.0.2" has incorrect peer dependency "@angular/core@>=2.3.1 <13.0.0 || ^12.0.0-next || ^12.1.0-next || ^12.2.0-next".
warning " > rxjs-tslint@0.1.8" has incorrect peer dependency "tslint@^5.0.0".
[5/5] 🔨 Building fresh packages...
[8/12] ⠠ @swimlane/ngx-graph
[2/12] ⠠ dtrace-provider
[9/12] ⠠ esbuild
[10/12] ⠠ @angular/cli
error /helix/helix-front/node_modules/@swimlane/ngx-graph: Command failed.
Exit code: 127
Command: ngcc --properties es2015 browser module main --first-only --create-ivy-entry-points
Arguments: |
|
Let's pin That fixes the yarn install. yarn
yarn install v1.22.1
warning package-lock.json found. Your project contains lock files generated by tools other than Yarn. It is advised not to mix package managers in order to avoid resolution inconsistencies caused by unsynchronized lock files. To clear this warning, remove package-lock.json.
[1/5] 🔍 Validating package.json...
[2/5] 🔍 Resolving packages...
warning @angular-devkit/build-angular > stylus > css > source-map-resolve@0.6.0: See https://github.com/lydell/source-map-resolve#deprecated
warning tslint@6.1.3: TSLint has been deprecated in favor of ESLint. Please see https://github.com/palantir/tslint/issues/4534 for more information.
[3/5] 🚚 Fetching packages...
info esbuild-darwin-arm64@0.14.22: The CPU architecture "x64" is incompatible with this module.
info "esbuild-darwin-arm64@0.14.22" is an optional dependency and failed compatibility check. Excluding it from installation.
info esbuild-freebsd-arm64@0.14.22: The platform "darwin" is incompatible with this module.
info "esbuild-freebsd-arm64@0.14.22" is an optional dependency and failed compatibility check. Excluding it from installation.
info esbuild-freebsd-arm64@0.14.22: The CPU architecture "x64" is incompatible with this module.
info esbuild-freebsd-64@0.14.22: The platform "darwin" is incompatible with this module.
info "esbuild-freebsd-64@0.14.22" is an optional dependency and failed compatibility check. Excluding it from installation.
info esbuild-android-arm64@0.14.22: The platform "darwin" is incompatible with this module.
info "esbuild-android-arm64@0.14.22" is an optional dependency and failed compatibility check. Excluding it from installation.
info esbuild-android-arm64@0.14.22: The CPU architecture "x64" is incompatible with this module.
info esbuild-linux-arm@0.14.22: The platform "darwin" is incompatible with this module.
info "esbuild-linux-arm@0.14.22" is an optional dependency and failed compatibility check. Excluding it from installation.
info esbuild-linux-arm@0.14.22: The CPU architecture "x64" is incompatible with this module.
info esbuild-linux-32@0.14.22: The platform "darwin" is incompatible with this module.
info "esbuild-linux-32@0.14.22" is an optional dependency and failed compatibility check. Excluding it from installation.
info esbuild-linux-32@0.14.22: The CPU architecture "x64" is incompatible with this module.
info esbuild-linux-mips64le@0.14.22: The platform "darwin" is incompatible with this module.
info "esbuild-linux-mips64le@0.14.22" is an optional dependency and failed compatibility check. Excluding it from installation.
info esbuild-linux-mips64le@0.14.22: The CPU architecture "x64" is incompatible with this module.
info esbuild-linux-riscv64@0.14.22: The platform "darwin" is incompatible with this module.
info "esbuild-linux-riscv64@0.14.22" is an optional dependency and failed compatibility check. Excluding it from installation.
info esbuild-linux-riscv64@0.14.22: The CPU architecture "x64" is incompatible with this module.
info esbuild-linux-ppc64le@0.14.22: The platform "darwin" is incompatible with this module.
info "esbuild-linux-ppc64le@0.14.22" is an optional dependency and failed compatibility check. Excluding it from installation.
info esbuild-linux-ppc64le@0.14.22: The CPU architecture "x64" is incompatible with this module.
info esbuild-linux-s390x@0.14.22: The platform "darwin" is incompatible with this module.
info "esbuild-linux-s390x@0.14.22" is an optional dependency and failed compatibility check. Excluding it from installation.
info esbuild-linux-s390x@0.14.22: The CPU architecture "x64" is incompatible with this module.
info esbuild-linux-arm64@0.14.22: The platform "darwin" is incompatible with this module.
info "esbuild-linux-arm64@0.14.22" is an optional dependency and failed compatibility check. Excluding it from installation.
info esbuild-linux-arm64@0.14.22: The CPU architecture "x64" is incompatible with this module.
info esbuild-sunos-64@0.14.22: The platform "darwin" is incompatible with this module.
info "esbuild-sunos-64@0.14.22" is an optional dependency and failed compatibility check. Excluding it from installation.
info esbuild-netbsd-64@0.14.22: The platform "darwin" is incompatible with this module.
info "esbuild-netbsd-64@0.14.22" is an optional dependency and failed compatibility check. Excluding it from installation.
info esbuild-openbsd-64@0.14.22: The platform "darwin" is incompatible with this module.
info "esbuild-openbsd-64@0.14.22" is an optional dependency and failed compatibility check. Excluding it from installation.
info esbuild-linux-64@0.14.22: The platform "darwin" is incompatible with this module.
info "esbuild-linux-64@0.14.22" is an optional dependency and failed compatibility check. Excluding it from installation.
info esbuild-windows-arm64@0.14.22: The platform "darwin" is incompatible with this module.
info "esbuild-windows-arm64@0.14.22" is an optional dependency and failed compatibility check. Excluding it from installation.
info esbuild-windows-arm64@0.14.22: The CPU architecture "x64" is incompatible with this module.
info esbuild-windows-64@0.14.22: The platform "darwin" is incompatible with this module.
info "esbuild-windows-64@0.14.22" is an optional dependency and failed compatibility check. Excluding it from installation.
info esbuild-windows-32@0.14.22: The platform "darwin" is incompatible with this module.
info "esbuild-windows-32@0.14.22" is an optional dependency and failed compatibility check. Excluding it from installation.
info esbuild-windows-32@0.14.22: The CPU architecture "x64" is incompatible with this module.
[4/5] 🔗 Linking dependencies...
warning " > ngx-vis@3.1.0" has incorrect peer dependency "keycharm@^0.2.0".
warning "ngx-vis > vis-timeline@7.5.1" has unmet peer dependency "propagating-hammerjs@^1.4.0 || ^2.0.0".
warning " > codelyzer@6.0.2" has incorrect peer dependency "@angular/compiler@>=2.3.1 <13.0.0 || ^12.0.0-next || ^12.1.0-next || ^12.2.0-next".
warning " > codelyzer@6.0.2" has incorrect peer dependency "@angular/core@>=2.3.1 <13.0.0 || ^12.0.0-next || ^12.1.0-next || ^12.2.0-next".
warning " > rxjs-tslint@0.1.8" has incorrect peer dependency "tslint@^5.0.0".
[5/5] 🔨 Building fresh packages...
success Saved lockfile.
✨ Done in 44.97s. |
|
Let's switch to yarn, while we are at it. |
|
Great, that worked. Now we are down to |
|
Let's work through these steps: Step 1 - Add relevant dependenciesThe first step is to run the schematic to add @angular-eslint to your project: ng add @angular-eslint/schematics
ℹ Using package manager: yarn
✔ Found compatible package version: @angular-eslint/schematics@13.2.1.
✔ Package information loaded.
The package @angular-eslint/schematics@13.2.1 will be installed and executed.
Would you like to proceed? Yes
error @typescript-eslint/experimental-utils@5.17.0: The engine "node" is incompatible with this module. Expected version "^12.22.0 || ^14.17.0 || >=16.0.0". Got "12.20.2"
error Found incompatible module.
✖ Package install failed, see above.Ah, let's update node: nvm install 12.22
Downloading and installing node v12.22.12...
Downloading https://nodejs.org/dist/v12.22.12/node-v12.22.12-darwin-x64.tar.xz...
######################################################################## 100.0%
Computing checksum with sha256sum
Checksums matched!
Now using node v12.22.12 (npm v6.14.16)Much better now: ng add @angular-eslint/schematics
ℹ Using package manager: yarn
✔ Found compatible package version: @angular-eslint/schematics@13.2.1.
✔ Package information loaded.
The package @angular-eslint/schematics@13.2.1 will be installed and executed.
Would you like to proceed? Yes
✔ Package successfully installed.
All @angular-eslint dependencies have been successfully installed 🎉
Please see https://github.com/angular-eslint/angular-eslint for how to add ESLint configuration to your project.
UPDATE package.json (3761 bytes)
✔ Packages installed successfully. |
Step 2 - Run the convert-tslint-to-eslint schematic on a projectng g @angular-eslint/schematics:convert-tslint-to-eslint helix-frontlogs: ng g @angular-eslint/schematics:convert-tslint-to-eslint helix-front
? Would you like to remove TSLint and its related config if there are no TSLint projects remaining after this conversion? Yes
? Would you like to ignore the existing TSLint config? Recommended if the TSLint config has not been altered much as it makes the
new ESLint config cleaner. No
INFO: We are now installing the "tslint-to-eslint-config" package into a tmp directory to aid with the conversion
This may take a minute or two...
WARNING: Within "tslint.json", the following 5 rule(s) did not have known converters in https://github.com/typescript-eslint/tslint-to-eslint-config
- rxjs-collapse-imports
- rxjs-no-static-observable-methods
- rxjs-pipeable-operators-only
- rxjs-proper-imports
- use-life-cycle-interface
You will need to decide on how to handle the above manually, but everything else has been handled for you automatically.
INFO: To most closely match your tslint.json, the `latest` version of the following eslint plugin(s) have been installed:
- eslint-plugin-import
- eslint-plugin-jsdoc
- eslint-plugin-prefer-arrow
Please note, you may wish to pin these to a specific version number in your package.json, rather than leaving it open to `latest`.
DELETE tslint.json
CREATE .eslintrc.json (2353 bytes)
UPDATE angular.json (4128 bytes)
UPDATE package.json (3829 bytes)
⠇ Installing packages (yarn)...error eslint-plugin-jsdoc@39.3.0: The engine "node" is incompatible with this module. Expected version "^14 || ^16 || ^17 || ^18". Got "12.22.12"
error Found incompatible module.
✖ Package install failed, see above.
The Schematic workflow failed. See above.Let's temporarily use a version of node that this script expects. Now it works: ng g @angular-eslint/schematics:convert-tslint-to-eslint helix-front
? Would you like to remove TSLint and its related config if there are no TSLint projects remaining after this conversion? No
? Would you like to ignore the existing TSLint config? Recommended if the TSLint config has not been altered much as it makes the
new ESLint config cleaner. No
INFO: We are now installing the "tslint-to-eslint-config" package into a tmp directory to aid with the conversion
This may take a minute or two...
UPDATE angular.json (4128 bytes) |
|
Next, we: ng g @angular-eslint/schematics:convert-tslint-to-eslint helix-front-e2elogs: ng g @angular-eslint/schematics:convert-tslint-to-eslint helix-front-e2e
? Would you like to remove TSLint and its related config if there are no TSLint projects remaining after this conversion? No
? Would you like to ignore the existing TSLint config? Recommended if the TSLint config has not been altered much as it makes the
new ESLint config cleaner. No
INFO: We are now installing the "tslint-to-eslint-config" package into a tmp directory to aid with the conversion
This may take a minute or two...
WARNING: Within "e2e/tslint.json", the following 5 rule(s) did not have known converters in https://github.com/typescript-eslint/tslint-to-eslint-config
- rxjs-collapse-imports
- rxjs-no-static-observable-methods
- rxjs-pipeable-operators-only
- rxjs-proper-imports
- use-life-cycle-interface
You will need to decide on how to handle the above manually, but everything else has been handled for you automatically.
CREATE e2e/.eslintrc.json (2122 bytes)
UPDATE angular.json (4352 bytes) |
yarn lint
yarn run v1.22.1
$ eslint --ext .ts,.html .
Oops! Something went wrong! :(
ESLint: 8.16.0
ESLint couldn't find the plugin "eslint-plugin-jsdoc".
(The package "eslint-plugin-jsdoc" was not found when loaded as a Node module from the directory "/Users/m/workspace/helix/helix-front".)
It's likely that the plugin isn't installed correctly. Try reinstalling by running the following:
npm install eslint-plugin-jsdoc@latest --save-dev
The plugin "eslint-plugin-jsdoc" was referenced from the config file in ".eslintrc.json#overrides[0] » plugin:@angular-eslint/ng-cli-compat--formatting-add-on".
If you still can't figure out the problem, please stop by https://eslint.org/chat/help to chat with the team.
error Command failed with exit code 2.
info Visit https://yarnpkg.com/en/docs/cli/run for documentation about this command.then yarn add -D eslint-plugin-jsdoc@latest
yarn add v1.22.1
[1/5] 🔍 Validating package.json...
[2/5] 🔍 Resolving packages...
[3/5] 🚚 Fetching packages...
error @typescript-eslint/experimental-utils@5.17.0: The engine "node" is incompatible with this module. Expected version "^12.22.0 || ^14.17.0 || >=16.0.0". Got "14.15.5"
error Found incompatible module.
info Visit https://yarnpkg.com/en/docs/cli/add for documentation about this command.Now we want an even higher node version. Hah. What version of node is compatible with Angular 13?
https://gist.github.com/LayZeeDK/c822cc812f75bb07b7c55d07ba2719b3 Let's try: nvm install 14.17 && nvm use 14.17 |
|
Now, once again: yarn add -D eslint-plugin-jsdoc@latest
yarn add v1.22.1
[1/5] 🔍 Validating package.json...
[2/5] 🔍 Resolving packages...
[3/5] 🚚 Fetching packages...
[4/5] 🔗 Linking dependencies...
warning " > ngx-vis@3.1.0" has incorrect peer dependency "keycharm@^0.2.0".
[5/5] 🔨 Building fresh packages...
success Saved lockfile.
success Saved 34 new dependencies.
info Direct dependencies
├─ eslint-plugin-import@2.26.0
├─ eslint-plugin-jsdoc@39.3.0
└─ eslint-plugin-prefer-arrow@1.2.3
info All dependencies
├─ @es-joy/jsdoccomment@0.30.0
├─ array-includes@3.1.5
├─ array.prototype.flat@1.3.0
├─ doctrine@2.1.0
├─ es-abstract@1.20.1
├─ es-shim-unscopables@1.0.0
├─ es-to-primitive@1.2.1
├─ eslint-import-resolver-node@0.3.6
├─ eslint-module-utils@2.7.3
├─ eslint-plugin-import@2.26.0
├─ eslint-plugin-jsdoc@39.3.0
├─ eslint-plugin-prefer-arrow@1.2.3
├─ function.prototype.name@1.1.5
├─ get-symbol-description@1.0.0
├─ has-bigints@1.0.2
├─ internal-slot@1.0.3
├─ is-bigint@1.0.4
├─ is-boolean-object@1.1.2
├─ is-callable@1.2.4
├─ is-date-object@1.0.5
├─ is-negative-zero@2.0.2
├─ is-number-object@1.0.7
├─ is-regex@1.1.4
├─ is-shared-array-buffer@1.0.2
├─ is-string@1.0.7
├─ is-symbol@1.0.4
├─ is-weakref@1.0.2
├─ jsdoc-type-pratt-parser@3.1.0
├─ object.values@1.1.5
├─ regexp.prototype.flags@1.4.3
├─ string.prototype.trimend@1.0.5
├─ string.prototype.trimstart@1.0.5
├─ unbox-primitive@1.0.2
└─ which-boxed-primitive@1.0.2
✨ Done in 9.38s. |
yarn lint
# ...
✖ 144 problems (144 errors, 0 warnings)
61 errors and 0 warnings potentially fixable with the `--fix` option.Now let's try yarn lint:fix
✖ 83 problems (83 errors, 0 warnings) |
yarn build
yarn run v1.22.1
$ rm -rf dist && mkdir dist && ng build --aot --configuration production && tsc -p server
⠙ Generating browser application bundles (phase: setup)...Processing legacy "View Engine" libraries:
- ngx-window-token [es2015/esm2015] (https://github.com/maxisam/ngx-window-token)
- ngx-vis [es2015/esm2015] (git+https://github.com/visjs/ngx-vis.git)
- @swimlane/ngx-datatable [es2015/esm2015] (git+https://github.com/swimlane/ngx-datatable.git)
- ngx-json-viewer [es2015/esm2015] (git+https://github.com/hivivo/ngx-json-viewer.git)
- ngx-clipboard [es2015/esm2015] (https://github.com/maxisam/ngx-clipboard)
- @swimlane/ngx-charts [es2015/esm2015] (git+https://github.com/swimlane/ngx-charts.git)
Encourage the library authors to publish an Ivy distribution.
✔ Browser application bundle generation complete.
✔ Copying assets complete.
✔ Index html generation complete.
Initial Chunk Files | Names | Raw Size | Estimated Transfer Size
main.b42d14379abde9cc.js | main | 3.14 MB | 561.19 kB
styles.869ddf56c8d43175.css | styles | 102.84 kB | 11.77 kB
polyfills.c98b6cf94ece2c4a.js | polyfills | 68.78 kB | 21.51 kB
runtime.93d35a893ab74671.js | runtime | 1.30 kB | 694 bytes
| Initial Total | 3.31 MB | 595.14 kB
Build at: 2022-05-24T07:39:39.198Z - Hash: 9f0090a1d1707329 - Time: 79491ms
Warning: /helix/helix-front/node_modules/@swimlane/ngx-graph/fesm2015/swimlane-ngx-graph.mjs depends on 'dagre'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies
Warning: /helix/helix-front/node_modules/@swimlane/ngx-graph/fesm2015/swimlane-ngx-graph.mjs depends on 'webcola'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies
Warning: /helix/helix-front/node_modules/ngx-vis/__ivy_ngcc__/fesm2015/ngxvis.js depends on 'vis-network'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies
Warning: /helix/helix-front/node_modules/ngx-vis/__ivy_ngcc__/fesm2015/ngxvis.js depends on 'vis-timeline'. CommonJS or AMD dependencies can cause optimization bailouts.
For more info see: https://angular.io/guide/build#configuring-commonjs-dependencies
Warning: ▲ [WARNING] "border-raius" is not a known CSS property
/helix/helix-front/client/app/dashboard/dashboard.component.scss:28:2:
28 │ border-raius: 80px/24px;
│ ~~~~~~~~~~~~
╵ border-radius
Did you mean "border-radius" instead?
Warning: ▲ [WARNING] "border-raius" is not a known CSS property
/helix/helix-front/client/app/dashboard/dashboard.component.scss:38:2:
38 │ border-raius: 5px;
│ ~~~~~~~~~~~~
╵ border-radius
Did you mean "border-radius" instead?
✨ Done in 85.09s. |
|
Let's fix those |
|
Let's test the upgrade from Angular 12.2 to Angular 13.3.
|
10 tasks
10 tasks
3 tasks
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
https://update.angular.io/?l=3&v=12.0-13.0
see:
The text was updated successfully, but these errors were encountered: