From daed9023bc5294da4bf0b6faca4f4afa50cf68fb Mon Sep 17 00:00:00 2001 From: nyawach Date: Fri, 18 Feb 2022 12:08:42 +0900 Subject: [PATCH] =?UTF-8?q?apollo-client=20=E3=81=A8=20Smart=20Query=20?= =?UTF-8?q?=E3=81=A7=E6=8A=95=E3=81=92=E3=82=8C=E3=82=8B=E3=82=88=E3=81=86?= =?UTF-8?q?=E3=81=AB=E3=81=BE=E3=81=A7?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- .../frontend/assets/apollo/getTest.gql | 37 +++++++++++++++++++ .../assets/util/createApolloClient.ts | 14 +++++++ 0022-nuxt-bridge/frontend/nuxt.config.ts | 15 +++++++- 0022-nuxt-bridge/frontend/package.json | 6 +++ 0022-nuxt-bridge/frontend/pages/index.vue | 13 ++++++- .../frontend/plugins/apollo-client.ts | 4 ++ 0022-nuxt-bridge/frontend/tsconfig.json | 2 +- 0022-nuxt-bridge/frontend/types/gql.d.ts | 13 +++++++ 0022-nuxt-bridge/frontend/yarn.lock | 25 ++++++++++++- 9 files changed, 124 insertions(+), 5 deletions(-) create mode 100644 0022-nuxt-bridge/frontend/assets/apollo/getTest.gql create mode 100644 0022-nuxt-bridge/frontend/assets/util/createApolloClient.ts create mode 100644 0022-nuxt-bridge/frontend/plugins/apollo-client.ts create mode 100644 0022-nuxt-bridge/frontend/types/gql.d.ts diff --git a/0022-nuxt-bridge/frontend/assets/apollo/getTest.gql b/0022-nuxt-bridge/frontend/assets/apollo/getTest.gql new file mode 100644 index 0000000..dbf05bb --- /dev/null +++ b/0022-nuxt-bridge/frontend/assets/apollo/getTest.gql @@ -0,0 +1,37 @@ +query getTest { + launchesPast(limit: 10) { + mission_name + launch_date_local + launch_site { + site_name_long + } + links { + article_link + video_link + } + rocket { + rocket_name + first_stage { + cores { + flight + core { + reuse_count + status + } + } + } + second_stage { + payloads { + payload_type + payload_mass_kg + payload_mass_lbs + } + } + } + ships { + name + home_port + image + } + } +} diff --git a/0022-nuxt-bridge/frontend/assets/util/createApolloClient.ts b/0022-nuxt-bridge/frontend/assets/util/createApolloClient.ts new file mode 100644 index 0000000..1aa94c0 --- /dev/null +++ b/0022-nuxt-bridge/frontend/assets/util/createApolloClient.ts @@ -0,0 +1,14 @@ +import { NuxtAppOptions } from '@nuxt/types' +import { createHttpLink } from 'apollo-link-http' +import fetch from 'isomorphic-fetch' + +export default (uri: string, app: NuxtAppOptions) => ({ + defaultHttpLink: false, + link: createHttpLink({ + uri, + credentials: 'same-origin', + fetch: async (uri: string, options) => { + return fetch(uri, options) + }, + }), +}) diff --git a/0022-nuxt-bridge/frontend/nuxt.config.ts b/0022-nuxt-bridge/frontend/nuxt.config.ts index 8365688..4b0d110 100644 --- a/0022-nuxt-bridge/frontend/nuxt.config.ts +++ b/0022-nuxt-bridge/frontend/nuxt.config.ts @@ -54,6 +54,12 @@ export default defineNuxtConfig({ strategy: 'no_prefix', }, + apollo: { + clientConfigs: { + default: '~/plugins/apollo-client.ts', + }, + }, + // Global CSS: https://go.nuxtjs.dev/config-css css: [], @@ -67,8 +73,15 @@ export default defineNuxtConfig({ buildModules: [], // Modules: https://go.nuxtjs.dev/config-modules - modules: ['@nuxtjs/i18n'], + modules: [ + '@nuxtjs/i18n', + '@nuxtjs/apollo', + ], // Build Configuration: https://go.nuxtjs.dev/config-build build: {}, + + alias: { + tslib: 'tslib/tslib.es6.js' + } }) diff --git a/0022-nuxt-bridge/frontend/package.json b/0022-nuxt-bridge/frontend/package.json index 4ab5211..fc3ae4e 100644 --- a/0022-nuxt-bridge/frontend/package.json +++ b/0022-nuxt-bridge/frontend/package.json @@ -1,5 +1,6 @@ { "name": "demo", + "type": "module", "version": "1.0.0", "private": true, "scripts": { @@ -14,9 +15,14 @@ }, "dependencies": { "@nuxtjs/apollo": "^4.0.1-rc.5", + "@types/isomorphic-fetch": "^0.0.35", "apollo-cache-inmemory": "^1.6.6", "apollo-client": "^2.6.10", + "apollo-link-http": "^1.5.17", "core-js": "^3.19.3", + "graphql": "^16.3.0", + "graphql-tag": "^2.12.6", + "isomorphic-fetch": "^3.0.0", "nuxt-edge": "latest", "vue": "^2.6.14", "vue-server-renderer": "^2.6.14", diff --git a/0022-nuxt-bridge/frontend/pages/index.vue b/0022-nuxt-bridge/frontend/pages/index.vue index 704bb18..402b00f 100644 --- a/0022-nuxt-bridge/frontend/pages/index.vue +++ b/0022-nuxt-bridge/frontend/pages/index.vue @@ -1,17 +1,26 @@ diff --git a/0022-nuxt-bridge/frontend/plugins/apollo-client.ts b/0022-nuxt-bridge/frontend/plugins/apollo-client.ts new file mode 100644 index 0000000..0430967 --- /dev/null +++ b/0022-nuxt-bridge/frontend/plugins/apollo-client.ts @@ -0,0 +1,4 @@ +import { Context } from '@nuxt/types' +import createApolloClient from '~/assets/util/createApolloClient' + +export default ({ app }: Context) => createApolloClient('https://api.spacex.land/graphql', app) diff --git a/0022-nuxt-bridge/frontend/tsconfig.json b/0022-nuxt-bridge/frontend/tsconfig.json index 2ad7c9f..e4d8d5f 100644 --- a/0022-nuxt-bridge/frontend/tsconfig.json +++ b/0022-nuxt-bridge/frontend/tsconfig.json @@ -16,7 +16,7 @@ "~/*": ["./*"], "@/*": ["./*"] }, - "types": ["@nuxt/types", "@types/node", "@nuxtjs/i18n"] + "types": ["@nuxt/types", "@types/node", "@nuxtjs/i18n", "vue-apollo", "~/types/*"] }, "exclude": ["node_modules", ".nuxt", "dist"] } diff --git a/0022-nuxt-bridge/frontend/types/gql.d.ts b/0022-nuxt-bridge/frontend/types/gql.d.ts new file mode 100644 index 0000000..d1f33c6 --- /dev/null +++ b/0022-nuxt-bridge/frontend/types/gql.d.ts @@ -0,0 +1,13 @@ +declare module '*.gql' { + import { DocumentNode } from 'graphql' + + const content: DocumentNode + export default content +} + +declare module '*.graphql' { + import { DocumentNode } from 'graphql' + + const content: DocumentNode + export default content +} diff --git a/0022-nuxt-bridge/frontend/yarn.lock b/0022-nuxt-bridge/frontend/yarn.lock index 09a598e..bddb31d 100644 --- a/0022-nuxt-bridge/frontend/yarn.lock +++ b/0022-nuxt-bridge/frontend/yarn.lock @@ -3005,6 +3005,11 @@ resolved "https://registry.yarnpkg.com/@types/http-errors/-/http-errors-1.8.2.tgz#7315b4c4c54f82d13fa61c228ec5c2ea5cc9e0e1" integrity sha512-EqX+YQxINb+MeXaIqYDASb6U6FCHbWjkj4a1CKDBks3d/QiB2+PqBLyO72vLDgAO1wUI4O+9gweRcQK11bTL/w== +"@types/isomorphic-fetch@^0.0.35": + version "0.0.35" + resolved "https://registry.yarnpkg.com/@types/isomorphic-fetch/-/isomorphic-fetch-0.0.35.tgz#c1c0d402daac324582b6186b91f8905340ea3361" + integrity sha512-DaZNUvLDCAnCTjgwxgiL1eQdxIKEpNLOlTNtAgnZc50bG2copGhRrFN9/PxPBuJe+tZVLCbQ7ls0xveXVRPkvw== + "@types/istanbul-lib-coverage@*", "@types/istanbul-lib-coverage@^2.0.0", "@types/istanbul-lib-coverage@^2.0.1": version "2.0.4" resolved "https://registry.yarnpkg.com/@types/istanbul-lib-coverage/-/istanbul-lib-coverage-2.0.4.tgz#8467d4b3c087805d63580480890791277ce35c44" @@ -8756,7 +8761,7 @@ graphql-tag@2.12.4: dependencies: tslib "^2.1.0" -graphql-tag@^2.10.1, graphql-tag@^2.10.3, graphql-tag@^2.11.0, graphql-tag@^2.12.3: +graphql-tag@^2.10.1, graphql-tag@^2.10.3, graphql-tag@^2.11.0, graphql-tag@^2.12.3, graphql-tag@^2.12.6: version "2.12.6" resolved "https://registry.yarnpkg.com/graphql-tag/-/graphql-tag-2.12.6.tgz#d441a569c1d2537ef10ca3d1633b48725329b5f1" integrity sha512-FdSNcu2QQcWnM2VNvSCCDCVS5PpPqpzgFT8+GXzqJuoDd0CBncxCY278u4mhRO7tMgo2JjgJA5aZ+nWSQ/Z+xg== @@ -8813,6 +8818,11 @@ graphql-ws@^4.4.1: resolved "https://registry.yarnpkg.com/graphql/-/graphql-15.8.0.tgz#33410e96b012fa3bdb1091cc99a94769db212b38" integrity sha512-5gghUc24tP9HRznNpV2+FIoq3xKkj5dTQqf4v0CpdPbFVwFkWoxOM+o+2OC9ZSvjEMTjfmG9QT+gcvggTwW1zw== +graphql@^16.3.0: + version "16.3.0" + resolved "https://registry.yarnpkg.com/graphql/-/graphql-16.3.0.tgz#a91e24d10babf9e60c706919bb182b53ccdffc05" + integrity sha512-xm+ANmA16BzCT5pLjuXySbQVFwH3oJctUVdy81w1sV0vBU0KgDdBGtxQOUd5zqOBk/JayAFeG8Dlmeq74rjm/A== + gzip-size@^6.0.0: version "6.0.0" resolved "https://registry.yarnpkg.com/gzip-size/-/gzip-size-6.0.0.tgz#065367fd50c239c0671cbcbad5be3e2eeb10e462" @@ -9902,6 +9912,14 @@ isobject@^3.0.0, isobject@^3.0.1: resolved "https://registry.yarnpkg.com/isobject/-/isobject-3.0.1.tgz#4e431e92b11a9731636aa1f9c8d1ccbcfdab78df" integrity sha1-TkMekrEalzFjaqH5yNHMvP2reN8= +isomorphic-fetch@^3.0.0: + version "3.0.0" + resolved "https://registry.yarnpkg.com/isomorphic-fetch/-/isomorphic-fetch-3.0.0.tgz#0267b005049046d2421207215d45d6a262b8b8b4" + integrity sha512-qvUtwJ3j6qwsF3jLxkZ72qCgjMysPzDfeV240JHiGZsANBYd+EEuu35v7dfrJ9Up0Ak07D7GGSkGhCHTqg/5wA== + dependencies: + node-fetch "^2.6.1" + whatwg-fetch "^3.4.1" + isomorphic-ws@4.0.1: version "4.0.1" resolved "https://registry.yarnpkg.com/isomorphic-ws/-/isomorphic-ws-4.0.1.tgz#55fd4cd6c5e6491e76dc125938dd863f5cd4f2dc" @@ -16505,6 +16523,11 @@ whatwg-encoding@^1.0.5: dependencies: iconv-lite "0.4.24" +whatwg-fetch@^3.4.1: + version "3.6.2" + resolved "https://registry.yarnpkg.com/whatwg-fetch/-/whatwg-fetch-3.6.2.tgz#dced24f37f2624ed0281725d51d0e2e3fe677f8c" + integrity sha512-bJlen0FcuU/0EMLrdbJ7zOnW6ITZLrZMIarMUVmdKtsGvZna8vxKYaexICWPfZ8qwf9fzNq+UEIZrnSaApt6RA== + whatwg-mimetype@^2.3.0: version "2.3.0" resolved "https://registry.yarnpkg.com/whatwg-mimetype/-/whatwg-mimetype-2.3.0.tgz#3d4b1e0312d2079879f826aff18dbeeca5960fbf"