ng serve errors

[jjadamec]

I keep getting these errors when I try "ng serve"

ERROR in C:/Users/jjadamec/workspace/rxjs-test/src/app/google-vision.service.ts (3,24): Cannot find module './api.key'.

ERROR in C:/Users/jjadamec/workspace/rxjs-test/src/app/app.component.spec.ts (6,1): Cannot find name 'describe'.
C:/Users/jjadamec/workspace/rxjs-test/src/app/app.component.spec.ts (7,3): Cannot find name 'beforeEach'.

I googled these errors, and most people are saying typings is not installed. But I did get typings installed and running with " npm install typings -g"

$ typings --version 2.1.1

$ node --version v6.10.2

$ npm --version 3.10.10

Its my first Angular demo I'm trying to get running. So any suggestions??

[ladyleet]

looks like typings for the tests aren't cooperating.. you can either try to run npm install again, or you can just delete the tests that are bothering it.

[jjadamec]

I got the web page running, with the changes I made to your files listed below.

But when I type in a word, I get console error in browser like

Console error: zone.js:1990 GET http://localhost:4201/suggest-keywords?q=banana net::ERR_CONNECTION_REFUSED

Response {_body: ProgressEvent, status: 0, ok: false, statusText: "", headers: Headers…} headers : Headers ok : false status : 0 statusText : "" type : 3 url : null _body : ProgressEvent proto : Body

I tried changing app.js to use plain http server, and pun-service.service.ts to use http gets, but still get same error. Maybe this demo is beyond my abilities to get working :(

errors and file changes to fix them: npm install problems -

npm WARN @angular/core@4.0.2 requires a peer of zone.js@^0.8.4 but none was installed.

fixed by editting package.json, change zone.js vesion to "zone.js": "^0.8.4" and re-run npm install

npm WARN deprecated minimatch@0.3.0: Please update to minimatch 3.0.2 or higher to avoid a RegExp DoS issue

solution: npm install mimimatch

ng serve ERROR's - 6 errors like: ERROR in C:/Users/jjadamec/workspace/rxjs-test/node_modules/@angular/material/typings/dialog/dialog-container.d.ts (2,32): Cannot find module '@angular/animations'. solution: run npm install '@angular/animations' then add to app.module.ts import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; and add to imports: [ in same file this: BrowserAnimationsModule,

3 errors like: ERROR in C:/Users/jjadamec/workspace/rxjs-test/src/app/google-vision.service.ts (3,24): Cannot find module './api.key'.

problem, file api.key is git-ignored, and was not checked in. .gitignore file has:

API Key File

/src/app/api.key.ts

Solution,comment out api.key import from google-vision.service.ts //import { apiKey } from './api.key'; and change this line to bogus text like: https://vision.googleapis.com/v1/images:annotate?key=BOGUS,

6 errors like:

ERROR in C:/Users/jjadamec/workspace/rxjs-test/src/app/app.component.spec.ts (6,1): Cannot find name 'describe'.

solution: add these "types": in tsconfig.json "jasmine", "node", "q", "selenium-webdriver"

1 error like:

ERROR in ./~/css-loader?{"sourceMap":false,"importLoaders":1}!./~/postcss-loader!./src/styles.css

Module not found: Error: Can't resolve '@angular/material/core/theming/prebuilt/indigo-pink.css' in 'C:\Users\jjadamec\workspace\rxjs-test\src'

solution: comment out the first line and add the second in styles.css / @import '~@angular/material/core/theming/prebuilt/indigo-pink.css'; / @import '~@angular/material/prebuilt-themes/indigo-pink.css';

On Tue, Apr 11, 2017 at 9:12 PM, Tracy Lee notifications@github.com wrote:

looks like typings for the tests aren't cooperating.. you can either try to run npm install again, or you can just delete the tests that are bothering it.

— You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub https://github.com/ladyleet/rxjs-test/issues/10#issuecomment-293460350, or mute the thread https://github.com/notifications/unsubscribe-auth/AG0kRDjfwZptqD88LUyjIlIH5r_A_Rteks5rvEEqgaJpZM4M5SF_ .

[ladyleet]

We didn't check in the api key - so if you go to Google Cloud API and sign up, input your own API key, see if that helps?

Let's see.. oh yes. MaterialModule is now deprecated so you'll have to import specific items. Though, I think if you remove the ^ from the angular material in your package.json to the version we used, that should fix a few things.

[ladyleet]

I should write a blog post on how to create this app! It will come soon. :)

[fulltilt]

I just got it to work just now. Here are the modifications I had to make after cloning from master:

Angular CLI: @angular/cli: 1.0.0 Node: 6.9.5

-Install @angular/animations: yarn add @angular/animations

-to get rid of the test file errors, I put the following on top of app.component.spec.ts: import {} from 'jasmine';

-for the resolve error in styles.css replace: @import '~@angular/material/core/theming/prebuilt/indigo-pink.css';

with

@import '~@angular/material/prebuilt-themes/indigo-pink.css';

-For the api key error, I created a new Google Vision api key and I just manually added it to google-vision-service.ts

-for the server, I just did a simple node app.js and the app worked

Hope this helps

[ladyleet]

Thanks so much @fulltilt !

[coderonfleek]

I keep getting this error

ERROR in /Users/imac/Documents/Practise/Third-Party-repos/rxjs-test-master/src/app/google-vision.service.ts (31,5): Type 'Observable<{}[]>' is not assignable to type 'Observable<string[]>'.
  Type '{}[]' is not assignable to type 'string[]'.
    Type '{}' is not assignable to type 'string'.

Cant seem to proceed beyond this point.