Skip to content

Commit f897e69

Browse files
DavidBuckDavidBuck
committed
update to Angular 10
1 parent c87c7f9 commit f897e69

File tree

11 files changed

+4877
-5747
lines changed

11 files changed

+4877
-5747
lines changed

‎browserslist‎ renamed to ‎.browserslistrc‎

File renamed without changes.

‎.prettierrc‎

Lines changed: 0 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,4 @@
11
{
2-
"semi": true,
32
"singleQuote": true,
4-
"bracketSpacing": true,
5-
"tabWidth": 2,
6-
"useTabs": false,
73
"trailingComma": "none"
84
}

‎README.md‎

Lines changed: 9 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,12 +1,18 @@
1-
# Angular 9 GraphQL Apollo Example
1+
# Angular 10 GraphQL Apollo Example
22

3-
This is a simple Angular 9 example that uses Apollo Angular to run queries and mutations on a mock GraphQL Backend.
3+
This is a simple Angular 10 example that uses Apollo Angular to run queries and mutations on a mock GraphQL Backend.
44

5-
Run `npm run start` to start the json-graphql-serve and the Angular client.
5+
Run `npm run start` to start the json-graphql-server and the Angular client.
66

77
## Tools
88

99
- [json-graphql-server](https://github.com/marmelab/json-graphql-server)
1010
- [Apollo Angular](https://www.npmjs.com/package/apollo-angular)
1111
- [Tailwind](https://tailwindcss.com)
1212
- [ng-tailwindcss](https://github.com/tehpsalmist/ng-tailwindcss)
13+
14+
## Versions
15+
16+
- [Version 1.1](https://github.com/DavidBuck/angular-graphql-apollo-example/releases/tag/v1.1) - Angular version 10.1.6.
17+
18+
- [Version 1.0](https://github.com/DavidBuck/angular-graphql-apollo-example/releases/tag/v1.0) - Angular version 9.1.1.

‎e2e/tsconfig.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
"compilerOptions": {
44
"outDir": "../out-tsc/e2e",
55
"module": "commonjs",
6-
"target": "es5",
6+
"target": "es2018",
77
"types": [
88
"jasmine",
99
"jasminewd2",

‎package-lock.json‎

Lines changed: 4720 additions & 5669 deletions
Some generated files are not rendered by default. Learn more about customizing how changed files appear on GitHub.

‎package.json‎

Lines changed: 36 additions & 40 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
{
22
"name": "angular-graphql-apollo-example",
3-
"version": "1.0.0",
3+
"version": "1.1.0",
44
"description": "Angular GraphQL Apollo example",
55
"author": "David Buck",
66
"repository": "github:davidbuck/angular-graphql-apollo-example",
@@ -17,50 +17,46 @@
1717
},
1818
"private": true,
1919
"dependencies": {
20-
"@angular/animations": "~9.1.1",
21-
"@angular/common": "~9.1.1",
22-
"@angular/compiler": "~9.1.1",
23-
"@angular/core": "~9.1.1",
24-
"@angular/forms": "~9.1.1",
25-
"@angular/platform-browser": "~9.1.1",
26-
"@angular/platform-browser-dynamic": "~9.1.1",
27-
"@angular/router": "~9.1.1",
28-
"apollo-angular": "^1.8.0",
29-
"apollo-angular-link-http": "^1.9.0",
30-
"apollo-cache-inmemory": "^1.6.5",
31-
"apollo-client": "^2.6.8",
32-
"apollo-link": "^1.2.11",
33-
"graphql": "^14.6.0",
34-
"graphql-tag": "^2.10.3",
35-
"rxjs": "~6.5.5",
36-
"tslib": "^1.10.0",
37-
"zone.js": "~0.10.2"
20+
"@angular/animations": "^10.1.6",
21+
"@angular/common": "^10.1.6",
22+
"@angular/compiler": "^10.1.6",
23+
"@angular/core": "^10.1.6",
24+
"@angular/forms": "^10.1.6",
25+
"@angular/platform-browser": "^10.1.6",
26+
"@angular/platform-browser-dynamic": "^10.1.6",
27+
"@angular/router": "^10.1.6",
28+
"apollo-angular": "^2.0.4",
29+
"graphql": "^15.0.0",
30+
"rxjs": "~6.6.3",
31+
"tslib": "^2.0.0",
32+
"zone.js": "~0.10.2",
33+
"@apollo/client": "^3.0.0"
3834
},
3935
"devDependencies": {
40-
"@angular-devkit/build-angular": "~0.901.1",
41-
"@angular/cli": "^9.1.1",
42-
"@angular/compiler-cli": "~9.1.1",
43-
"@angular/language-service": "~9.1.1",
44-
"@types/jasmine": "~3.3.8",
36+
"@angular-devkit/build-angular": "^0.1001.7",
37+
"@angular/cli": "^10.1.7",
38+
"@angular/compiler-cli": "^10.1.6",
39+
"@angular/language-service": "^10.1.6",
40+
"@types/jasmine": "^3.5.14",
4541
"@types/jasminewd2": "~2.0.3",
46-
"@types/node": "^12.11.1",
47-
"codelyzer": "^5.1.2",
48-
"concurrently": "^5.1.0",
49-
"jasmine-core": "~3.4.0",
50-
"jasmine-spec-reporter": "~4.2.1",
42+
"@types/node": "^12.12.68",
43+
"codelyzer": "^6.0.1",
44+
"concurrently": "^5.3.0",
45+
"jasmine-core": "^3.6.0",
46+
"jasmine-spec-reporter": "~5.0.0",
5147
"json-graphql-server": "^2.1.3",
52-
"karma": "~4.1.0",
53-
"karma-chrome-launcher": "~2.2.0",
54-
"karma-coverage-istanbul-reporter": "~2.0.1",
55-
"karma-jasmine": "~2.0.1",
56-
"karma-jasmine-html-reporter": "^1.5.3",
57-
"prettier": "^1.19.1",
58-
"protractor": "^5.4.3",
59-
"tailwindcss": "^1.2.0",
60-
"ts-node": "~7.0.0",
61-
"tslint": "~5.15.0",
48+
"karma": "~5.0.0",
49+
"karma-chrome-launcher": "~3.1.0",
50+
"karma-coverage-istanbul-reporter": "~3.0.2",
51+
"karma-jasmine": "~4.0.0",
52+
"karma-jasmine-html-reporter": "^1.5.0",
53+
"prettier": "^2.1.2",
54+
"protractor": "~7.0.0",
55+
"tailwindcss": "^1.9.4",
56+
"ts-node": "^8.3.0",
57+
"tslint": "~6.1.0",
6258
"tslint-config-prettier": "^1.18.0",
6359
"tslint-plugin-prettier": "^2.3.0",
64-
"typescript": "~3.8.3"
60+
"typescript": "~4.0.3"
6561
}
6662
}

‎src/app/app.component.ts‎

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -23,24 +23,24 @@ export class AppComponent implements OnInit {
2323

2424
addPostGraphql() {
2525
this.dataService.addPostGraphql(this.newPost).subscribe(
26-
res => console.log(res),
27-
err => console.error(err)
26+
(res) => console.log(res),
27+
(err) => console.error(err)
2828
);
2929
}
3030

3131
updatePostGraphql() {
3232
this.dataService
3333
.updatePostGraphql({ id: 4, title: 'Updated Post' })
3434
.subscribe(
35-
res => console.log(res),
36-
err => console.error(err)
35+
(res) => console.log(res),
36+
(err) => console.error(err)
3737
);
3838
}
3939

4040
deletePostGraphql() {
4141
this.dataService.deletePostGraphql(1).subscribe(
42-
res => console.log(res),
43-
err => console.error(err)
42+
(res) => console.log(res),
43+
(err) => console.error(err)
4444
);
4545
}
4646
}

‎src/app/graphql-server.service.ts‎

Lines changed: 16 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
1+
import { gql, Apollo } from 'apollo-angular';
12
import { Injectable } from '@angular/core';
23
import { Observable } from 'rxjs';
3-
import gql from 'graphql-tag';
4-
import { Apollo } from 'apollo-angular';
4+
55
import { Post } from './post';
66

77
@Injectable({
@@ -49,9 +49,12 @@ export class GraphqlServerService {
4949
mutation: this.query,
5050
variables: post,
5151
update: (store, { data: { createPost } }) => {
52-
const data: any = store.readQuery({ query: this.allPosts });
53-
data.allPosts = [...data.allPosts, createPost];
54-
store.writeQuery({ query: this.allPosts, data });
52+
const existingPosts: any = store.readQuery({ query: this.allPosts });
53+
const newPosts = [...existingPosts.allPosts, createPost];
54+
store.writeQuery({
55+
query: this.allPosts,
56+
data: { allPosts: newPosts }
57+
});
5558
}
5659
});
5760
}
@@ -84,10 +87,14 @@ export class GraphqlServerService {
8487
return this.apollo.mutate({
8588
mutation: this.query,
8689
variables: { id: deleteId },
87-
update: store => {
88-
const data: any = store.readQuery({ query: this.allPosts });
89-
data.allPosts.splice(deleteId - 1, 1);
90-
store.writeQuery({ query: this.allPosts, data });
90+
update: (store) => {
91+
const existingPosts: any = store.readQuery({ query: this.allPosts });
92+
const updatedPosts = [...existingPosts.allPosts];
93+
updatedPosts.splice(deleteId - 1, 1);
94+
store.writeQuery({
95+
query: this.allPosts,
96+
data: { allPosts: updatedPosts }
97+
});
9198
}
9299
});
93100
}

‎src/app/graphql.module.ts‎

Lines changed: 3 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -1,7 +1,7 @@
1+
import { APOLLO_OPTIONS } from 'apollo-angular';
2+
import { HttpLink } from 'apollo-angular/http';
3+
import { InMemoryCache } from '@apollo/client/core';
14
import { NgModule } from '@angular/core';
2-
import { ApolloModule, APOLLO_OPTIONS } from 'apollo-angular';
3-
import { HttpLinkModule, HttpLink } from 'apollo-angular-link-http';
4-
import { InMemoryCache } from 'apollo-cache-inmemory';
55

66
const uri = 'http://localhost:3000/graphql';
77

@@ -13,7 +13,6 @@ export function createApollo(httpLink: HttpLink) {
1313
}
1414

1515
@NgModule({
16-
exports: [ApolloModule, HttpLinkModule],
1716
providers: [
1817
{
1918
provide: APOLLO_OPTIONS,

‎tsconfig.json‎

Lines changed: 3 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -7,7 +7,7 @@
77
"declaration": false,
88
"downlevelIteration": true,
99
"experimentalDecorators": true,
10-
"module": "esnext",
10+
"module": "es2020",
1111
"moduleResolution": "node",
1212
"importHelpers": true,
1313
"target": "es2015",
@@ -18,7 +18,8 @@
1818
"es2018",
1919
"dom",
2020
"esnext.asynciterable"
21-
]
21+
],
22+
"allowSyntheticDefaultImports": true
2223
},
2324
"angularCompilerOptions": {
2425
"fullTemplateTypeCheck": true,

0 commit comments

Comments
 (0)