NOOB, how to build ng-chat

[aslansservant42]

Hi, I am relatively new to Angular so please excuse the stupid question but I really want to contribute to your excellent project. I have quite a bit of experience writing chat bots and chat end points and want to add the ability to do "quick responses" if the client is talking to a bot. I cannot use your component as-is because Angular strips the button tags and the "onClick=" from the Message.message when you put it into the innerHtml. More on that later...

I have forked your repository to my own GitHub account and cloned it to my local machine. I know how to use npm link to create a symlink from my local ng-chat to my client. I believe that I now need to run ng build ng-chat but when I try it from the command line in the root directory I get:

C:\development\src\ChatBots\AngularClient\ng-chat>ng build ng-chat

Date: 2018-11-28T21:15:36.323Z Hash: 9c5150967a8f50ad6392 Time: 14006ms chunk {main} main.js, main.js.map (main) 657 bytes [initial] [rendered] chunk {polyfills} polyfills.js, polyfills.js.map (polyfills) 105 kB [initial] [rendered] chunk {runtime} runtime.js, runtime.js.map (runtime) 6.08 kB [entry] [rendered]

ERROR in demo/offline_bot/src/app/app.component.ts(2,29): error TS2307: Cannot find module 'ng-chat'. demo/offline_bot/src/app/app.module.ts(7,30): error TS2307: Cannot find module 'ng-chat'. demo/offline_bot/src/app/demo-adapter-paged-history.ts(1,109): error TS2307: Cannot find module 'ng-chat'. demo/offline_bot/src/app/demo-adapter-paged-history.ts(69,18): error TS2339: Property 'onMessageReceived' does not exist on type 'DemoAdapterPagedHistory'. demo/offline_bot/src/app/demo-adapter.ts(1,84): error TS2307: Cannot find module 'ng-chat'. demo/offline_bot/src/app/demo-adapter.ts(106,18): error TS2339: Property 'onMessageReceived' does not exist on type 'Dem oAdapter'. src/spec/ng-chat.component.spec.ts(15,12): error TS2416: Property 'listFriends' in type 'MockableAdapter' is not assigna ble to the same property in base type 'ChatAdapter'. Type '() => Observable<User[]>' is not assignable to type '() => Observable<UserResponse[]>'. Type 'Observable<User[]>' is not assignable to type 'Observable<UserResponse[]>'. Type 'User[]' is not assignable to type 'UserResponse[]'. Type 'User' is not assignable to type 'UserResponse'. Property 'User' is missing in type 'User'.

when I try the same thing from the src/ directory I get:

C:\development\src\ChatBots\AngularClient\ng-chat\src>ng build ng-chat

Date: 2018-11-28T21:16:51.402Z Hash: 986c8962b77a2394797b Time: 13871ms chunk {main} main.js, main.js.map (main) 657 bytes [initial] [rendered] chunk {polyfills} polyfills.js, polyfills.js.map (polyfills) 105 kB [initial] [rendered] chunk {runtime} runtime.js, runtime.js.map (runtime) 6.08 kB [entry] [rendered]

ERROR in ../demo/offline_bot/src/app/app.component.ts(2,29): error TS2307: Cannot find module 'ng-chat'. ../demo/offline_bot/src/app/app.module.ts(7,30): error TS2307: Cannot find module 'ng-chat'. ../demo/offline_bot/src/app/demo-adapter-paged-history.ts(1,109): error TS2307: Cannot find module 'ng-chat'. ../demo/offline_bot/src/app/demo-adapter-paged-history.ts(69,18): error TS2339: Property 'onMessageReceived' does not ex ist on type 'DemoAdapterPagedHistory'. ../demo/offline_bot/src/app/demo-adapter.ts(1,84): error TS2307: Cannot find module 'ng-chat'. ../demo/offline_bot/src/app/demo-adapter.ts(106,18): error TS2339: Property 'onMessageReceived' does not exist on type ' DemoAdapter'. spec/ng-chat.component.spec.ts(15,12): error TS2416: Property 'listFriends' in type 'MockableAdapter' is not assignable to the same property in base type 'ChatAdapter'. Type '() => Observable<User[]>' is not assignable to type '() => Observable<UserResponse[]>'. Type 'Observable<User[]>' is not assignable to type 'Observable<UserResponse[]>'. Type 'User[]' is not assignable to type 'UserResponse[]'. Type 'User' is not assignable to type 'UserResponse'. Property 'User' is missing in type 'User'.

Again, I apologize for the noob question but this is my first attempt to work with a github based project.

Stephen G.

[aslansservant42]

backed up and tried to use offline-bot as described in

did npm install on offline bot then tried npm run start and got:

ng4-chat@0.0.0 start C:\development\src\ChatBots\AngularClient\ng-chat\demo\offline_bot ng serve

Could not find module "@angular-devkit/build-angular" from "C:\development\src\ChatBots\AngularClient\ng-chat\dem \offline_bot". Error: Could not find module "@angular-devkit/build-angular" from "C:\development\src\ChatBots\AngularClient\ng-ch t\demo\offline_bot". at Object.resolve (C:\development\src\ChatBots\AngularClient\ng-chat\demo\offline_bot\node_modules\@angular-devkit\ ore\node\resolve.js:141:11) at Observable.rxjs_1.Observable [as _subscribe] (C:\development\src\ChatBots\AngularClient\ng-chat\demo\offline_bot node_modules\@angular-devkit\architect\src\architect.js:132:40) at Observable._trySubscribe (C:\development\src\ChatBots\AngularClient\ng-chat\demo\offline_bot\node_modules\rxjs\i ternal\Observable.js:44:25) at Observable.subscribe (C:\development\src\ChatBots\AngularClient\ng-chat\demo\offline_bot\node_modules\rxjs\inter al\Observable.js:30:22) at C:\development\src\ChatBots\AngularClient\ng-chat\demo\offline_bot\node_modules\rxjs\internal\Observable.js:99:1

at new Promise (<anonymous>)
at Observable.toPromise (C:\development\src\ChatBots\AngularClient\ng-chat\demo\offline_bot\node_modules\rxjs\inter

al\Observable.js:97:16) at ServeCommand.initialize (C:\development\src\ChatBots\AngularClient\ng-chat\demo\offline_bot\node_modules\@angula \cli\models\architect-command.js:88:94) at at process._tickCallback (internal/process/next_tick.js:188:7) npm ERR! code ELIFECYCLE npm ERR! errno 1 npm ERR! ng4-chat@0.0.0 start: ng serve npm ERR! Exit status 1 npm ERR! npm ERR! Failed at the ng4-chat@0.0.0 start script. npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in: npm ERR! C:\Users\B18305\AppData\Roaming\npm-cache_logs\2018-11-28T23_02_32_920Z-debug.log

[rpaschoal]

Hi Stephen,

Thank you for your interest in contributing to the project, much appreciated.

The distribution package is located under src but as a test for now, could you just try serving the Angular offline bot project? Don't try to do a NPM link, just clone the repository and try to ng serve it without a link so ng-chat can be pulled from NPM. If we get this working, at least we know you can run the angular project that we use for smoke testing the application.

After that we can discuss running, testing and linking the source component.

Cheers!

[aslansservant42]

I did npm unlink ng-chat in the offline_bot dir and even did ng unlink in the ng-chat/src directory. I then did the following with the given results. BTW I am using branch 1.3.0 locally. `C:\development\src\ChatBots\AngularClient\ng-chat\demo>cd offline_bot

C:\development\src\ChatBots\AngularClient\ng-chat\demo\offline_bot>npm install npm WARN optional SKIPPING OPTIONAL DEPENDENCY: fsevents@1.2.4 (node_modules\fsevents): npm WARN notsup SKIPPING OPTIONAL DEPENDENCY: Unsupported platform for fsevents@1.2.4: wanted {"os":"darwin","arch":"any "} (current: {"os":"win32","arch":"x64"})

added 684 packages in 213.795s

C:\development\src\ChatBots\AngularClient\ng-chat\demo\offline_bot>npm run start

ng4-chat@0.0.0 start C:\development\src\ChatBots\AngularClient\ng-chat\demo\offline_bot ng serve

Could not find module "@angular-devkit/build-angular" from "C:\development\src\ChatBots\AngularClient\ng-chat\demo \offline_bot". Error: Could not find module "@angular-devkit/build-angular" from "C:\development\src\ChatBots\AngularClient\ng-cha t\demo\offline_bot". at Object.resolve (C:\development\src\ChatBots\AngularClient\ng-chat\demo\offline_bot\node_modules\@angular-devkit\c ore\node\resolve.js:141:11) at Observable.rxjs_1.Observable [as _subscribe] (C:\development\src\ChatBots\AngularClient\ng-chat\demo\offline_bot\ node_modules\@angular-devkit\architect\src\architect.js:132:40) at Observable._trySubscribe (C:\development\src\ChatBots\AngularClient\ng-chat\demo\offline_bot\node_modules\rxjs\in ternal\Observable.js:44:25) at Observable.subscribe (C:\development\src\ChatBots\AngularClient\ng-chat\demo\offline_bot\node_modules\rxjs\intern al\Observable.js:30:22) at C:\development\src\ChatBots\AngularClient\ng-chat\demo\offline_bot\node_modules\rxjs\internal\Observable.js:99:19

at new Promise (<anonymous>)
at Observable.toPromise (C:\development\src\ChatBots\AngularClient\ng-chat\demo\offline_bot\node_modules\rxjs\intern

al\Observable.js:97:16) at ServeCommand.initialize (C:\development\src\ChatBots\AngularClient\ng-chat\demo\offline_bot\node_modules\@angular \cli\models\architect-command.js:88:94) at at process._tickCallback (internal/process/next_tick.js:188:7) npm ERR! code ELIFECYCLE npm ERR! errno 1 npm ERR! ng4-chat@0.0.0 start: ng serve npm ERR! Exit status 1 npm ERR! npm ERR! Failed at the ng4-chat@0.0.0 start script. npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in: npm ERR! C:\Users\B18305\AppData\Roaming\npm-cache_logs\2018-11-29T17_25_01_554Z-debug.log`

[rpaschoal]

Hmm, that sounds weird... I usually just do a NPM install and then ng serve --open

Could you try with branch 1.3.0 as this is the one I am using atm for developing new features?

[aslansservant42]

that is the branch I am using.

[rpaschoal]

Hi @aslansservant42 ,

I've found out the reason. I've upgraded the version of the CLI using ng update @angular/cli but that didn't add a dev dependency that is now required on newer versions of Angular which is @angular-devkit/build-angular

For now just run npm install --save-dev @angular-devkit/build-angular on the demo/offline_bot folder and after that you should be able to run that project.

Branch 1.3.0 is a work in progress and you might hit other compilation issues that I haven't sorted out yet. Could you try pulling from master which has everything up to date with the release on NPM? Then after that just push your changes through a pull request to master, I can then pull that to 1.3.0 or similar.

So just summarizing: pull/clone from master, run npm install --save-dev @angular-devkit/build-angular in the offline bot demo folder then run npm run start or ng serve --open.

[aslansservant42]

using master branch C:\development\src\ChatBots\AngularClient\ng-chat\demo\offline_bot>ng serve --open Angular Live Development Server is listening on localhost:4200, open your browser on http://localhost:4200/

Date: 2018-11-30T19:28:26.727Z Hash: 63d25316fea2d28c5cdb Time: 8135ms chunk {main} main.js, main.js.map (main) 1.92 kB [initial] [rendered] chunk {polyfills} polyfills.js, polyfills.js.map (polyfills) 92.4 kB [initial] [rendered] chunk {runtime} runtime.js, runtime.js.map (runtime) 6.08 kB [entry] [rendered] chunk {styles} styles.js, styles.js.map (styles) 16.3 kB [initial] [rendered] chunk {vendor} vendor.js, vendor.js.map (vendor) 322 kB [initial] [rendered]

ERROR in The Angular Compiler requires TypeScript >=3.1.1 and <3.2.0 but 3.2.1 was found instead. i ?wdm?: Failed to compile.

[rpaschoal]

Hi @aslansservant42 ,

I had that yesterday too but I thought it was just due to my setup as I was testing on a laptop I use for other development.

https://github.com/rpaschoal/ng-chat/blob/master/demo/offline_bot/package.json

If you have a look at the package.json file, you can see there is a typescript dev dependency there so it should have worked fine.

To sort this out, you can try running npm install typescript -g (If it keeps failing you can try a specific version npm install typescript@3.1.1 -g) and then npm link typescript.

[JacobSiegle]

I cannot get this project to compile either. I've tried many different combinations over the past hour to get it to work.

Here's a log from my last attempt - 1) Clone fork 2) cd src 3) npm link 4) cd .. 5) cd demo 6) npm link ng-chat 7) ng serve from demo, offline_bot, project root gives "Could not find module "@angular-devkit/build-angular"" 8) cd demo/offline_bot 9) npm install --save-dev @angular-devkit/build-angular 10) ng serve from demo/offline_bot gives "Cannot find module 'typescript'" 11) npm install typescript -g 12) ng serve continue to gives gives "Cannot find module 'typescript'" 13) cd to root, ng serve gives "Could not find module "@angular-devkit/build-angular"" 15) Try "npm install --save-dev @angular-devkit/build-angular" in root 16) ng serve gives "Could not find the implementation for builder @angular-devkit/build-angular:dev-server" 17) Try clearing node_modules from src folder, no luck. 18) cd to demo/offline_bot, try "npm install" just for the heck of it. 19) Try ng serve "Schema validation failed with the following errors: Data path ".builders['app-shell']" should have required property 'class'." 20) cd back to root and try "npm install" again. 21) Try ng serve "ERROR in ./src/main.ts Module build failed (from ./node_modules/@ngtools/webpack/src/index.js): Error: Cannot find module '@angular/compiler-cli/ngcc'" 22) npm install --save-dev @angular/compiler-cli 23) Could not find the implementation for builder @angular-devkit/build-angular:dev-server 24) Give up too much work.

Are the steps in "CONTRIBUTING.md" exactly every command in order that needs to be run?

[cesguto]

I'm having the same problem, I can't test the changes I make.

1. Clone fork
2. cd src
3. npm link
4. cd ..
5. cd demo
6. npm link ng-chat
7. cd offline_bot
8. npm install
9. ng serve

My changes do not apply