Tiledesk Dashboard: Error while building and ng serve on arm64 (Mac M1 + Ubuntu Server 22.04 Arm64)

Hi All,
I am trying to build Tiledesk Dashboard and running into the issues below.

With ng2-tooltip-directive version 2.9.22, npm install works just fine but when do ng serve, I get following error:

ERROR in The Angular Compiler requires TypeScript >=2.7.2 and <2.10.0 but 3.9.10 was found instead.

If I upgrade typescript by running npm install typescript@“>=2.7.2 <2.10.0” and the do ng serve, I get following error:

ERROR in node_modules/@types/node/assert.d.ts(2,68): error TS1144: '{' or ';' expected.
node_modules/@types/node/assert.d.ts(35,68): error TS1144: '{' or ';' expected.
node_modules/@types/node/assert.d.ts(44,94): error TS1144: '{' or ';' expected.
node_modules/@types/node/assert.d.ts(44,101): error TS1005: ';' expected.
node_modules/@types/node/assert.d.ts(44,104): error TS1005: ';' expected.
node_modules/@types/node/assert.d.ts(46,98): error TS1144: '{' or ';' expected.
node_modules/@types/node/assert.d.ts(46,105): error TS1005: ';' expected.
node_modules/@types/node/assert.d.ts(46,108): error TS1005: ';' expected.
node_modules/@types/node/assert.d.ts(54,47): error TS1144: '{' or ';' expected.
node_modules/@types/node/assert.d.ts(54,53): error TS1005: ';' expected.
node_modules/@types/node/assert.d.ts(54,56): error TS1005: ';' expected.
node_modules/@types/node/assert.d.ts(81,61): error TS1005: ';' expected.
node_modules/@types/node/base.d.ts(10,1): error TS1084: Invalid 'reference' directive syntax.
node_modules/@types/node/base.d.ts(11,1): error TS1084: Invalid 'reference' directive syntax.
node_modules/@types/node/base.d.ts(12,1): error TS1084: Invalid 'reference' directive syntax.
node_modules/@types/node/base.d.ts(13,1): error TS1084: Invalid 'reference' directive syntax.
node_modules/@types/node/ts3.6/base.d.ts(10,1): error TS1084: Invalid 'reference' directive syntax.
node_modules/@types/node/ts3.6/base.d.ts(11,1): error TS1084: Invalid 'reference' directive syntax.
node_modules/@types/node/ts3.6/base.d.ts(12,1): error TS1084: Invalid 'reference' directive syntax.
node_modules/@types/node/ts3.6/base.d.ts(13,1): error TS1084: Invalid 'reference' directive syntax.

My configurations are:

OS:
1, MacOS Monterey (12.4) - Running on Apple Silicon
2. Ubuntu Server for arm64 22.04 - Running in Parallels Desktop VM
Python 3.10.4 or Python 2.7.18 (tried with both)
Node: 10.24.1
NPM: 6.14.12
Package                           Version
-----------------------------------------------------------
@angular-devkit/architect         0.13.10
@angular-devkit/build-angular     0.13.10
@angular-devkit/build-optimizer   0.13.10
@angular-devkit/build-webpack     0.13.10
@angular-devkit/core              7.3.10
@angular-devkit/schematics        0.8.9
@angular/cdk                      5.2.5
@angular/cli                      6.2.9
@angular/compiler-cli             6.1.10
@angular/material                 5.2.5
@ngtools/webpack                  7.3.10
@schematics/angular               0.8.9
@schematics/update                0.8.9
rxjs                              5.5.12
typescript                        3.9.10
webpack                           4.29.0

If i uninstall typescript 3.9, and manually install typescript 2.7.x using npm install -d typescript@2.7.2, and do ng serve, I get following error:

tsconfig.json(22,5): error TS5023: Unknown compiler option 'resolveJsonModule'.

Error: tsconfig.json(22,5): error TS5023: Unknown compiler option 'resolveJsonModule'.

    at AngularCompilerPlugin._setupOptions (/home/vahid/Workspace/development/git/tiledesk-dashboard/node_modules/@ngtools/webpack/src/angular_compiler_plugin.js:94:19)
    at new AngularCompilerPlugin (/home/vahid/Workspace/development/git/tiledesk-dashboard/node_modules/@ngtools/webpack/src/angular_compiler_plugin.js:53:14)
    at _createAotPlugin (/home/vahid/Workspace/development/git/tiledesk-dashboard/node_modules/@angular-devkit/build-angular/src/angular-cli-files/models/webpack-configs/typescript.js:37:12)
    at Object.getNonAotConfig (/home/vahid/Workspace/development/git/tiledesk-dashboard/node_modules/@angular-devkit/build-angular/src/angular-cli-files/models/webpack-configs/typescript.js:43:19)
    at BrowserBuilder.buildWebpackConfig (/home/vahid/Workspace/development/git/tiledesk-dashboard/node_modules/@angular-devkit/build-angular/src/browser/index.js:89:37)
    at DevServerBuilder.buildWebpackConfig (/home/vahid/Workspace/development/git/tiledesk-dashboard/node_modules/@angular-devkit/build-angular/src/dev-server/index.js:108:46)
    at MergeMapSubscriber.rxjs_1.from.pipe.operators_1.concatMap [as project] (/home/vahid/Workspace/development/git/tiledesk-dashboard/node_modules/@angular-devkit/build-angular/src/dev-server/index.js:36:40)
    at MergeMapSubscriber._tryNext (/home/vahid/Workspace/development/git/tiledesk-dashboard/node_modules/@angular-devkit/build-angular/node_modules/rxjs/internal/operators/mergeMap.js:69:27)
    at MergeMapSubscriber._next (/home/vahid/Workspace/development/git/tiledesk-dashboard/node_modules/@angular-devkit/build-angular/node_modules/rxjs/internal/operators/mergeMap.js:59:18)
    at MergeMapSubscriber.Subscriber.next (/home/vahid/Workspace/development/git/tiledesk-dashboard/node_modules/@angular-devkit/build-angular/node_modules/rxjs/internal/Subscriber.js:67:18)
    at TapSubscriber._next (/home/vahid/Workspace/development/git/tiledesk-dashboard/node_modules/@angular-devkit/build-angular/node_modules/rxjs/internal/operators/tap.js:65:26)
    at TapSubscriber.Subscriber.next (/home/vahid/Workspace/development/git/tiledesk-dashboard/node_modules/@angular-devkit/build-angular/node_modules/rxjs/internal/Subscriber.js:67:18)
    at MergeMapSubscriber.notifyNext (/home/vahid/Workspace/development/git/tiledesk-dashboard/node_modules/@angular-devkit/build-angular/node_modules/rxjs/internal/operators/mergeMap.js:92:26)
    at InnerSubscriber._next (/home/vahid/Workspace/development/git/tiledesk-dashboard/node_modules/@angular-devkit/build-angular/node_modules/rxjs/internal/InnerSubscriber.js:28:21)
    at InnerSubscriber.Subscriber.next (/home/vahid/Workspace/development/git/tiledesk-dashboard/node_modules/@angular-devkit/build-angular/node_modules/rxjs/internal/Subscriber.js:67:18)
    at SafeSubscriber.__tryOrUnsub (/home/vahid/Workspace/development/git/tiledesk-dashboard/node_modules/@angular/cli/node_modules/rxjs/internal/Subscriber.js:205:16)

I have also tried removing “resolveJsonModule: true” from tsconfig.json and get the error below:

ERROR in node_modules/@types/node/assert.d.ts(2,68): error TS1144: '{' or ';' expected.
node_modules/@types/node/assert.d.ts(35,68): error TS1144: '{' or ';' expected.
node_modules/@types/node/assert.d.ts(44,94): error TS1144: '{' or ';' expected.
node_modules/@types/node/assert.d.ts(44,101): error TS1005: ';' expected.
node_modules/@types/node/assert.d.ts(44,104): error TS1005: ';' expected.
node_modules/@types/node/assert.d.ts(46,98): error TS1144: '{' or ';' expected.
node_modules/@types/node/assert.d.ts(46,105): error TS1005: ';' expected.
node_modules/@types/node/assert.d.ts(46,108): error TS1005: ';' expected.
node_modules/@types/node/assert.d.ts(54,47): error TS1144: '{' or ';' expected.
node_modules/@types/node/assert.d.ts(54,53): error TS1005: ';' expected.
node_modules/@types/node/assert.d.ts(54,56): error TS1005: ';' expected.
node_modules/@types/node/assert.d.ts(81,61): error TS1005: ';' expected.
node_modules/@types/node/base.d.ts(10,1): error TS1084: Invalid 'reference' directive syntax.
node_modules/@types/node/base.d.ts(11,1): error TS1084: Invalid 'reference' directive syntax.
node_modules/@types/node/base.d.ts(12,1): error TS1084: Invalid 'reference' directive syntax.
node_modules/@types/node/base.d.ts(13,1): error TS1084: Invalid 'reference' directive syntax.
node_modules/@types/node/ts3.6/base.d.ts(10,1): error TS1084: Invalid 'reference' directive syntax.
node_modules/@types/node/ts3.6/base.d.ts(11,1): error TS1084: Invalid 'reference' directive syntax.
node_modules/@types/node/ts3.6/base.d.ts(12,1): error TS1084: Invalid 'reference' directive syntax.
node_modules/@types/node/ts3.6/base.d.ts(13,1): error TS1084: Invalid 'reference' directive syntax.
node_modules/@types/node/util.d.ts(142,24): error TS1144: '{' or ';' expected.
node_modules/@types/node/util.d.ts(143,13): error TS1005: '(' expected.
node_modules/@types/node/util.d.ts(143,23): error TS1005: ',' expected.
node_modules/@types/node/util.d.ts(146,13): error TS1005: '(' expected.
node_modules/@types/node/util.d.ts(146,28): error TS1005: '(' expected.
node_modules/@types/node/util.d.ts(156,24): error TS1144: '{' or ';' expected.
node_modules/@types/node/util.d.ts(157,13): error TS1005: '(' expected.
node_modules/@types/node/util.d.ts(157,23): error TS1005: ',' expected.
node_modules/@types/node/util.d.ts(160,13): error TS1005: '(' expected.
node_modules/@types/node/util.d.ts(160,23): error TS1005: '(' expected.
node_modules/autolinker/dist/commonjs/match/match.d.ts(159,23): error TS1144: '{' or ';' expected.
node_modules/autolinker/dist/commonjs/match/match.d.ts(160,1): error TS1128: Declaration or statement expected.
node_modules/firebase/index.d.ts(4892,38): error TS1005: ';' expected.
node_modules/moment-timezone/index.d.ts(57,77): error TS1005: ';' expected.
node_modules/moment-timezone/index.d.ts(57,92): error TS1005: ';' expected.
node_modules/moment-timezone/index.d.ts(57,111): error TS1005: ';' expected.
node_modules/moment-timezone/index.d.ts(58,27): error TS1005: ';' expected.
node_modules/moment-timezone/index.d.ts(58,49): error TS1005: ')' expected.
node_modules/moment-timezone/index.d.ts(58,71): error TS1109: Expression expected.
node_modules/moment-timezone/index.d.ts(58,74): error TS1005: ';' expected.
node_modules/moment-timezone/index.d.ts(58,75): error TS1128: Declaration or statement expected.
node_modules/moment-timezone/index.d.ts(58,79): error TS1005: ';' expected.
node_modules/moment-timezone/index.d.ts(59,32): error TS1005: ',' expected.
node_modules/moment-timezone/index.d.ts(59,54): error TS1109: Expression expected.
node_modules/moment-timezone/index.d.ts(59,64): error TS1005: ';' expected.
node_modules/moment-timezone/index.d.ts(60,20): error TS1005: ';' expected.
node_modules/moment-timezone/index.d.ts(61,27): error TS1109: Expression expected.
node_modules/moment-timezone/index.d.ts(61,37): error TS1005: ';' expected.
node_modules/moment-timezone/index.d.ts(63,29): error TS1109: Expression expected.
node_modules/moment-timezone/index.d.ts(63,38): error TS1005: ';' expected.
node_modules/moment-timezone/index.d.ts(74,1): error TS1128: Declaration or statement expected.

Any ideas?

Thanks a lot in advance.

Waheed

I have finally managed to test it on intel/amd x64 arch too, same results, same errors and no luck. Looks like package.json is all messed up and instructions to build from code are missing something.

Tested on:

Fedora
Ubuntu
Mac OS

Intel, AMD as well as Apple Silicon.

Any kind of help is appreciated.

Waheed

Dear waheed,

I will check it out and let you know as soon as possible.

Nicola

Thank you so much Nicola. Really appreciate your reply.

BTW I am trying to build from source from Master branch.

Thanks again.

Waheed

Dear wahid I cloned the dashboard from the master and, using node version 10.24.1, I ran npm install. I also encountered several errors which I resolved by deleting the “node_modules” folder and running the npm installation using node version 10.15.1 (npm v6.4.1). I have updated the README.md file if you need it.
Below the screenshot of my setup.
I hope I have been useful to you.
Let me know if you still run into any problems.
Nicola

image

Hi Nicola,
Thank you so much. I am giving it a try now. Will keep you posted in an hour.

Waheed

Hi Nicola,
I am not getting build errors anymore but I am stuck at this error:

Mac Apple Silicon
node -v: v10.15.1
npm -v: 6.4.1

Ubuntu 22.04
node -v: v10.16.0
npm -v: 6.9.0 (6.4.1 looks in compatible ubuntu 22.04, I will check it with Ubuntu 16 LTS in the morning and get back)

my ng version spits out:

Happens on mac Apple Silicon as well as Ubuntu 22.04.

Waheed

Hi Nicola,
Thank you so much. With your last updated, I am finally I am able to build and serve it on older version of Ubuntu i.e. 16.4 LTS on x64 architecture.

BUT >>

Though, I am able to build it on MacOS and ubuntu lates version (22.04), it does not ng serve and through these errors. Looks like the latest OS’s have something to do with it. My hunch is:

Ubuntu 22.04> npm 6.4.1 is no more compatible

MacOS + Ubuntu 22.04 > Python version is also a contributing factor.

Waheed

Hi Nicola,
Finally I am able to build on Mac OS Apple Silicon as well by doing:

  • Deleting the complete project and copying over all the files again from repo
  • npm rebuild node-sass

And then following the standard procedure as mentioned in the README.

Ubuntu 22.04 is another story though since npm 6.4.1 is not compatible on that. I will test with one node 10.6 on Ubuntu 22.04 and update you.

Waheed

Hi Waheed,

good news! Please keep us updated about Ubuntu.

Thx and Enjoy your weekend :wink:
Michele

Hi Waheed,
any news about Ubuntu?
Since last week we have Discord server. We can continue with the conversation there.
This is the invite.
There are also a lot of news about Tiledesk we’re sharing on daily basis with our Community.
Cheers,
Michele

Hi guys,
sorry I got caught up into something. I will test and get back within this week.

Waheed

ok, keep us posted! :wink: