ng serve failing. Seems like dependency management issue

[milesfrain]

I'm having trouble building this project, even when attempting to match the older Angular version. Could someone run through the build steps on their machine and confirm they still work today?

Here are my steps for reference:

npm install -g angular-cli@1.0.0-beta.19-3
npm install
ng serve

This results in a Cannot find module '@angular/compiler-cli/ngcc' error, and a bunch of UNMET PEER DEPENDENCY warnings under npm list -g -depth 0

I put together a more detailed log of troubleshooting steps below:

Starting conditions:

Global packages:

Nothing other than npm installed.

miles@x1c5 ~/p/j/d/DiffEqOnline> npm list -g -depth 0
/home/miles/.nvm/versions/node/v11.10.1/lib
└── npm@6.7.0

Local packages:

Nothing installed.
Unmet dependencies expected.

miles@x1c5 ~/p/j/d/DiffEqOnline> npm list -depth 0
julia-api-demo@0.0.0 /home/miles/projects/julia/deq_demo/DiffEqOnline
├── UNMET DEPENDENCY @angular/common@~2.1.0
...
└── UNMET DEPENDENCY zone.js@^0.6.23

After installing angular-cli:

npm install -g angular-cli@1.0.0-beta.19-3

Peer dependency warnings in build log:

npm WARN @ngtools/webpack@8.2.1 requires a peer of @angular/compiler-cli@^8.0.0-beta.0 || ^8.1.0-beta.0 || ^8.2.0-beta.0 || ^8.3.0-beta.0 || ^8.4.0-beta.0 || >=9.0.0-beta < 9 but none is installed. You must install peer dependencies yourself.
npm WARN @ngtools/webpack@8.2.1 requires a peer of typescript@>=3.4 < 3.6 but none is installed. You must install peer dependencies yourself.
npm WARN @ngtools/webpack@8.2.1 requires a peer of webpack@^4.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN expose-loader@0.7.5 requires a peer of webpack@^2.0.0 || ^3.0.0 || ^4.0.0 but none is installed. You must install peer dependencies yourself.
npm WARN string-replace-loader@1.3.0 requires a peer of webpack@1 || 2 || 3 but none is installed. You must install peer dependencies yourself.
npm WARN webpack-dev-middleware@1.12.2 requires a peer of webpack@^1.0.0 || ^2.0.0 || ^3.0.0 but none is installed. You must install peer dependencies yourself.

Global packages.

angular-cli added.
Lots of missing peer dependency warnings. I assume I need to manually install all of these. Will attempt that after the npm install step.

miles@x1c5 ~/p/j/d/DiffEqOnline> npm list -g -depth 0
/home/miles/.nvm/versions/node/v11.10.1/lib
├── angular-cli@1.0.0-beta.19-3
└── npm@6.7.0

npm ERR! peer dep missing: @angular/compiler-cli@^8.0.0-beta.0 || ^8.1.0-beta.0 || ^8.2.0-beta.0 || ^8.3.0-beta.0 || ^8.4.0-beta.0 || >=9.0.0-beta < 9, required by @ngtools/webpack@8.2.1
npm ERR! peer dep missing: typescript@>=3.4 < 3.6, required by @ngtools/webpack@8.2.1
npm ERR! peer dep missing: webpack@^4.0.0, required by @ngtools/webpack@8.2.1
npm ERR! peer dep missing: webpack@^2.0.0 || ^3.0.0 || ^4.0.0, required by expose-loader@0.7.5
npm ERR! peer dep missing: webpack@1 || 2 || 3, required by string-replace-loader@1.3.0
npm ERR! peer dep missing: webpack@^1.0.0 || ^2.0.0 || ^3.0.0, required by webpack-dev-middleware@1.12.2
npm ERR! peer dep missing: webpack@^1.0.0 || ^2.0.0 || ^3.0.0, required by webpack-dev-middleware@1.12.2

Local packages:

Listing is unchanged, as expected. (log omitted for brevity).

After installing local dependencies:

npm install
This adds some of the missing local package dependencies, but there are lots of unmet peer dependencies.

Local packages:

miles@x1c5 ~/p/j/d/DiffEqOnline> npm list --depth=0
julia-api-demo@0.0.0 /home/miles/projects/julia/deq_demo/DiffEqOnline
├── UNMET PEER DEPENDENCY @angular/common@2.1.2
├── UNMET PEER DEPENDENCY @angular/compiler@2.1.2
├── UNMET PEER DEPENDENCY @angular/core@2.1.2
├── UNMET PEER DEPENDENCY @angular/forms@2.1.2
├── @angular/http@2.1.2
├── UNMET PEER DEPENDENCY @angular/platform-browser@2.1.2
├── UNMET PEER DEPENDENCY @angular/platform-browser-dynamic@2.1.2
├── UNMET PEER DEPENDENCY @angular/router@3.1.2
├── @types/jasmine@2.8.16
├── @types/node@6.14.7
├── UNMET PEER DEPENDENCY @webcomponents/custom-elements@1.2.4
├── angular-cli@1.0.0-beta.19-3
├── clarity-angular@0.7.5-dev
├── clarity-icons@0.7.5-dev
├── clarity-ui@0.7.5-dev
├── codelyzer@1.0.0-beta.1
├── core-js@2.6.9
├── file-saver@1.3.8
├── jasmine-core@2.4.1
├── jasmine-spec-reporter@2.5.0
├── karma@1.2.0
├── karma-chrome-launcher@2.2.0
├── karma-cli@1.0.1
├── karma-jasmine@1.1.2
├── karma-remap-istanbul@0.2.2
├── mutationobserver-shim@0.3.3
├── plotly@1.0.6
├── protractor@4.0.9
├── rxjs@5.0.0-beta.12
├── ts-helpers@1.1.2
├── ts-node@1.2.1
├── tslint@3.13.0
├── UNMET PEER DEPENDENCY typescript@2.0.10
├── webdriver-manager@10.2.5
└── zone.js@0.6.26

npm ERR! peer dep missing: @angular/common@^2.2.0, required by clarity-angular@0.7.5-dev
npm ERR! peer dep missing: @angular/compiler@^2.2.0, required by clarity-angular@0.7.5-dev
npm ERR! peer dep missing: @angular/core@^2.2.0, required by clarity-angular@0.7.5-dev
npm ERR! peer dep missing: @angular/forms@^2.2.0, required by clarity-angular@0.7.5-dev
npm ERR! peer dep missing: @angular/platform-browser@^2.2.0, required by clarity-angular@0.7.5-dev
npm ERR! peer dep missing: @angular/platform-browser-dynamic@^2.2.0, required by clarity-angular@0.7.5-dev
npm ERR! peer dep missing: @angular/router@^3.2.0, required by clarity-angular@0.7.5-dev
npm ERR! peer dep missing: @webcomponents/custom-elements@1.0.0-alpha.3, required by clarity-icons@0.7.5-dev
npm ERR! peer dep missing: typescript@>=3.4 < 3.6, required by @ngtools/webpack@8.2.1
npm ERR! peer dep missing: @angular/common@^2.2.0, required by clarity-angular@0.7.5-dev
npm ERR! peer dep missing: @angular/compiler@^2.2.0, required by clarity-angular@0.7.5-dev
npm ERR! peer dep missing: @angular/compiler-cli@^8.0.0-beta.0 || ^8.1.0-beta.0 || ^8.2.0-beta.0 || ^8.3.0-beta.0 || ^8.4.0-beta.0 || >=9.0.0-beta < 9, required by @ngtools/webpack@8.2.1
npm ERR! peer dep missing: @angular/core@^2.2.0, required by clarity-angular@0.7.5-dev
npm ERR! peer dep missing: @angular/platform-browser@^2.2.0, required by clarity-angular@0.7.5-dev
npm ERR! peer dep missing: typescript@>=3.4 < 3.6, required by @ngtools/webpack@8.2.1
npm ERR! peer dep missing: webpack@^4.0.0, required by @ngtools/webpack@8.2.1
npm ERR! peer dep missing: webpack@^2.0.0 || ^3.0.0 || ^4.0.0, required by expose-loader@0.7.5
npm ERR! peer dep missing: webpack@1 || 2 || 3, required by string-replace-loader@1.3.0
npm ERR! peer dep missing: webpack@^1.0.0 || ^2.0.0 || ^3.0.0, required by webpack-dev-middleware@1.12.2
npm ERR! peer dep missing: webpack@^1.0.0 || ^2.0.0 || ^3.0.0, required by webpack-dev-middleware@1.12.2

Global packages:

Listing is unchanged, as expected. (log omitted for brevity).

Attempting to install an unmet peer dependency

Let's look at one of the first dependency errors in our local listing:
UNMET PEER DEPENDENCY @angular/common@2.1.2
and
npm ERR! peer dep missing: @angular/common@^2.2.0, required by clarity-angular@0.7.5-dev

I'm interpreting this as @angular/common@2.1.2 is currently installed, but we need to bump this to 2.2.0 to satisfy clarity-angular requirements.

I see the following lines in package.json
"@angular/common": "^2.1.2",
"clarity-angular": "^0.7.5-dev",

Installing required version with:
npm install @angular/common@2.2.0
This updated package.json too.

Now the local listing shows this pair of errors:
UNMET PEER DEPENDENCY @angular/common@2.2.0
npm ERR! peer dep missing: @angular/common@2.1.2, required by @angular/forms@2.1.2

So there's a mismatch where:
@angular/common@2.1.2 is required by @angular/forms@2.1.2
but
@angular/common@^2.2.0 is required by clarity-angular@0.7.5-dev

I'm assuming it's safer to bump the minor version of @angular/forms and friends to 2.2.0.

Another conflict is
@webcomponents/custom-elements@1.0.0-alpha.3, required by clarity-icons@0.7.5-dev
where @webcomponents/custom-elements@1.2.4 is installed.
Probably not good to revert custom-elements, but the next version of clarity-icons is a major version bump, so seems like things may break either way. It also seems impossible to update clarity-icons to a point where it's compatible with custom-elements@1.2.4, since the latest version (as of today) only goes up to 1.1.0 https://github.com/vmware/clarity/blob/9749d669943adf7e53d71b84ec0eaee8a3bc7137/package.json#L92
I'm wondering if I can just ignore this unmet peer dependency.

Here's a diff of what seems to have cut down on most peer dependency issues

miles@x1c5 ~/p/j/d/DiffEqOnline> git diff
diff --git a/package.json b/package.json
index 29fb31e..71708a2 100644
--- a/package.json
+++ b/package.json
@@ -13,14 +13,14 @@
   },
   "private": true,
   "dependencies": {
-    "@angular/common": "~2.1.0",
-    "@angular/compiler": "~2.1.0",
-    "@angular/core": "~2.1.0",
-    "@angular/forms": "~2.1.0",
-    "@angular/http": "~2.1.0",
-    "@angular/platform-browser": "~2.1.0",
-    "@angular/platform-browser-dynamic": "~2.1.0",
-    "@angular/router": "~3.1.0",
+    "@angular/common": "^2.2.4",
+    "@angular/compiler": "~2.2.0",
+    "@angular/core": "~2.2.0",
+    "@angular/forms": "~2.2.0",
+    "@angular/http": "~2.2.0",
+    "@angular/platform-browser": "~2.2.0",
+    "@angular/platform-browser-dynamic": "~2.2.0",
+    "@angular/router": "^3.2.4",
     "@webcomponents/custom-elements": "^1.0.0-alpha.3",
     "clarity-angular": "^0.7.5-dev",
     "clarity-icons": "^0.7.5-dev",

But a bunch still remain:

miles@x1c5 ~/p/j/d/DiffEqOnline> npm list --depth=0
julia-api-demo@0.0.0 /home/miles/projects/julia/deq_demo/DiffEqOnline
├── @angular/common@2.2.4
├── @angular/compiler@2.2.4
├── @angular/core@2.2.4
├── @angular/forms@2.2.4
├── @angular/http@2.2.4
├── @angular/platform-browser@2.2.4
├── @angular/platform-browser-dynamic@2.2.4
├── @angular/router@3.2.4
├── @types/jasmine@2.8.16
├── @types/node@6.14.7
├── UNMET PEER DEPENDENCY @webcomponents/custom-elements@1.2.4
├── angular-cli@1.0.0-beta.19-3
├── clarity-angular@0.7.5-dev
├── clarity-icons@0.7.5-dev
├── clarity-ui@0.7.5-dev
├── codelyzer@1.0.0-beta.1
├── core-js@2.6.9
├── file-saver@1.3.8
├── jasmine-core@2.4.1
├── jasmine-spec-reporter@2.5.0
├── karma@1.2.0
├── karma-chrome-launcher@2.2.0
├── karma-cli@1.0.1
├── karma-jasmine@1.1.2
├── karma-remap-istanbul@0.2.2
├── mutationobserver-shim@0.3.3
├── plotly@1.0.6
├── protractor@4.0.9
├── rxjs@5.0.0-beta.12
├── ts-helpers@1.1.2
├── ts-node@1.2.1
├── tslint@3.13.0
├── UNMET PEER DEPENDENCY typescript@2.0.10
├── webdriver-manager@10.2.5
└── zone.js@0.6.26

npm ERR! peer dep missing: @webcomponents/custom-elements@1.0.0-alpha.3, required by clarity-icons@0.7.5-dev
npm ERR! peer dep missing: typescript@>=3.4 < 3.6, required by @ngtools/webpack@8.2.1
npm ERR! peer dep missing: @angular/compiler-cli@^8.0.0-beta.0 || ^8.1.0-beta.0 || ^8.2.0-beta.0 || ^8.3.0-beta.0 || ^8.4.0-beta.0 || >=9.0.0-beta < 9, required by @ngtools/webpack@8.2.1
npm ERR! peer dep missing: @angular/common@2.1.2, required by @angular/platform-server@2.1.2
npm ERR! peer dep missing: @angular/compiler@2.1.2, required by @angular/compiler-cli@2.1.2
npm ERR! peer dep missing: @angular/compiler@2.1.2, required by @angular/platform-server@2.1.2
npm ERR! peer dep missing: @angular/core@2.1.2, required by @angular/compiler-cli@2.1.2
npm ERR! peer dep missing: @angular/core@2.1.2, required by @angular/platform-server@2.1.2
npm ERR! peer dep missing: @angular/platform-browser@2.1.2, required by @angular/platform-server@2.1.2
npm ERR! peer dep missing: typescript@>=3.4 < 3.6, required by @ngtools/webpack@8.2.1
npm ERR! peer dep missing: webpack@^4.0.0, required by @ngtools/webpack@8.2.1
npm ERR! peer dep missing: webpack@^2.0.0 || ^3.0.0 || ^4.0.0, required by expose-loader@0.7.5
npm ERR! peer dep missing: webpack@1 || 2 || 3, required by string-replace-loader@1.3.0
npm ERR! peer dep missing: webpack@^1.0.0 || ^2.0.0 || ^3.0.0, required by webpack-dev-middleware@1.12.2
npm ERR! peer dep missing: webpack@^1.0.0 || ^2.0.0 || ^3.0.0, required by webpack-dev-middleware@1.12.2

Attempting ng serve at this point still results in a Cannot find module '@angular/compiler-cli/ngcc' error.

[milesfrain]

Also considered attempting to upgrade the app from angular2 to angular8, but I don't have much confidence in this succeeding.
https://update.angular.io/#2.0:8.0

[ChrisRackauckas]

Yes, this library is setup for Angular2 and Julia 0.5. It needs an update

[amellnik]

The front-end used a very early version of Angular 2+, but fortunately its very simple -- I can rewrite it in current Angular. @ChrisRackauckas I remember we were waiting on something to update the backend to Julia 1.x -- is that possible now or are we still blocked?

[ChrisRackauckas]

It was the compilation setup. I think we can do that now just by using FunctionWrappers.