From 3f9eb596e9572225a8bc166d28bdceb10ed6ce98 Mon Sep 17 00:00:00 2001 From: Guillaume Chau Date: Sun, 1 Dec 2019 22:37:31 +0100 Subject: [PATCH] refactor: split into @vue/apollo-ssr --- .circleci/config.yml | 7 ++-- packages/test-ssr/src/entry-server.js | 4 +- packages/vue-apollo-option/ssr/index.d.ts | 21 ---------- packages/vue-apollo-option/ssr/index.js | 32 --------------- packages/vue-apollo-ssr/README.md | 3 ++ packages/vue-apollo-ssr/package.json | 37 +++++++++++++++++ packages/vue-apollo-ssr/src/index.ts | 48 +++++++++++++++++++++++ packages/vue-apollo-ssr/tsconfig.json | 10 +++++ 8 files changed, 104 insertions(+), 58 deletions(-) delete mode 100644 packages/vue-apollo-option/ssr/index.d.ts delete mode 100644 packages/vue-apollo-option/ssr/index.js create mode 100644 packages/vue-apollo-ssr/README.md create mode 100644 packages/vue-apollo-ssr/package.json create mode 100644 packages/vue-apollo-ssr/src/index.ts create mode 100644 packages/vue-apollo-ssr/tsconfig.json diff --git a/.circleci/config.yml b/.circleci/config.yml index 1d35271..5cbe190 100644 --- a/.circleci/config.yml +++ b/.circleci/config.yml @@ -20,9 +20,9 @@ jobs: # Download and cache dependencies - restore_cache: keys: - - v6-dependencies-{{ checksum "yarn.lock" }} + - v7-dependencies-{{ checksum "yarn.lock" }} # fallback to using the latest cache if no exact match is found - - v6-dependencies- + - v7-dependencies- - run: yarn install @@ -36,9 +36,10 @@ jobs: - packages/vue-apollo-components/node_modules - packages/vue-apollo-composable/node_modules - packages/vue-apollo-option/node_modules + - packages/vue-apollo-ssr/node_modules - packages/vue-apollo-util/node_modules - ~/.cache - key: v6-dependencies-{{ checksum "yarn.lock" }} + key: v7-dependencies-{{ checksum "yarn.lock" }} # run tests! - run: yarn build diff --git a/packages/test-ssr/src/entry-server.js b/packages/test-ssr/src/entry-server.js index 20500a3..95d541f 100644 --- a/packages/test-ssr/src/entry-server.js +++ b/packages/test-ssr/src/entry-server.js @@ -1,5 +1,5 @@ import 'isomorphic-fetch' -import ApolloSSR from 'vue-apollo/ssr' +import * as ApolloSSR from '@vue/apollo-ssr' import { createApp } from './main' const prepareUrlForRouting = url => { @@ -22,7 +22,7 @@ export default context => { router.onReady(() => { context.rendered = () => { // Same for Apollo client cache - context.apolloState = ApolloSSR.getStates(apolloProvider) + context.apolloState = ApolloSSR.getStates(apolloProvider.clients) } resolve(app) }, reject) diff --git a/packages/vue-apollo-option/ssr/index.d.ts b/packages/vue-apollo-option/ssr/index.d.ts deleted file mode 100644 index fbffe5e..0000000 --- a/packages/vue-apollo-option/ssr/index.d.ts +++ /dev/null @@ -1,21 +0,0 @@ -import {ApolloProvider} from "vue-apollo"; - -interface GetStatesOptions { - exportNamespace?: string; -} - -interface ExportStatesOptions { - globalName?: string; - attachTo?: string; - useUnsafeSerializer?: boolean; -} - -interface ApolloSsr { - serializeStates(provider: ApolloProvider, options?: GetStatesOptions): string - getStates(provider: ApolloProvider, options?: GetStatesOptions): {[key: string]: {}} - exportStates(provider: ApolloProvider, options: ExportStatesOptions): string -} - -declare const ssr: ApolloSsr - -export default ssr; diff --git a/packages/vue-apollo-option/ssr/index.js b/packages/vue-apollo-option/ssr/index.js deleted file mode 100644 index 310615b..0000000 --- a/packages/vue-apollo-option/ssr/index.js +++ /dev/null @@ -1,32 +0,0 @@ -const serializeJs = require('serialize-javascript') - -exports.serializeStates = function (apolloProvider, options = {}) { - const state = exports.getStates(apolloProvider, options) - - return options.useUnsafeSerializer - ? JSON.stringify(state) - : serializeJs(state) -} - -exports.getStates = function (apolloProvider, options = {}) { - const finalOptions = Object.assign({}, { - exportNamespace: '', - }, options) - const states = {} - for (const key in apolloProvider.clients) { - const client = apolloProvider.clients[key] - const state = client.cache.extract() - states[`${finalOptions.exportNamespace}${key}`] = state - } - return states -} - -exports.exportStates = function (apolloProvider, options) { - const finalOptions = Object.assign({}, { - globalName: '__APOLLO_STATE__', - attachTo: 'window', - useUnsafeSerializer: false, - }, options) - - return `${finalOptions.attachTo}.${finalOptions.globalName} = ${exports.serializeStates(apolloProvider, options)};` -} diff --git a/packages/vue-apollo-ssr/README.md b/packages/vue-apollo-ssr/README.md new file mode 100644 index 0000000..ba49fc7 --- /dev/null +++ b/packages/vue-apollo-ssr/README.md @@ -0,0 +1,3 @@ +# @vue/apollo-ssr + +Server-Side Rendering Utilities for Vue Apollo diff --git a/packages/vue-apollo-ssr/package.json b/packages/vue-apollo-ssr/package.json new file mode 100644 index 0000000..e66f3dd --- /dev/null +++ b/packages/vue-apollo-ssr/package.json @@ -0,0 +1,37 @@ +{ + "name": "@vue/apollo-ssr", + "version": "4.0.0-alpha.1", + "description": "Apollo GraphQL for Vue - Server Side Rendering utilities", + "repository": { + "type": "git", + "url": "git+https://github.com/Akryum/vue-apollo.git" + }, + "keywords": [ + "vue", + "apollo", + "graphql", + "ssr" + ], + "author": "Guillaume Chau ", + "license": "MIT", + "bugs": { + "url": "https://github.com/Akryum/vue-apollo/issues" + }, + "homepage": "https://github.com/Akryum/vue-apollo#readme", + "publishConfig": { + "access": "public" + }, + "main": "dist/index.js", + "types": "dist/index.d.ts", + "files": [ + "dist" + ], + "scripts": { + "dev": "yarn build --watch", + "build": "tsc --outDir dist -d", + "prepublishOnly": "yarn build" + }, + "devDependencies": { + "typescript": "^3.7.2" + } +} \ No newline at end of file diff --git a/packages/vue-apollo-ssr/src/index.ts b/packages/vue-apollo-ssr/src/index.ts new file mode 100644 index 0000000..7f6fc1b --- /dev/null +++ b/packages/vue-apollo-ssr/src/index.ts @@ -0,0 +1,48 @@ +import serializeJs from 'serialize-javascript' +import ApolloClient from 'apollo-client' + +export type ApolloClients = { [key: string]: ApolloClient } + +export interface SerializeStatesOptions { + useUnsafeSerializer?: boolean +} + +export function serializeStates (apolloClients: ApolloClients, options: SerializeStatesOptions & GetStatesOptions = {}) { + const state = getStates(apolloClients, options) + + return options.useUnsafeSerializer + ? JSON.stringify(state) + : serializeJs(state) +} + +export interface GetStatesOptions { + exportNamespace?: string +} + +export function getStates (apolloClients: ApolloClients, options: GetStatesOptions = {}) { + const finalOptions = Object.assign({}, { + exportNamespace: '', + }, options) + const states = {} + for (const key in apolloClients) { + const client = apolloClients[key] + const state = client.cache.extract() + states[`${finalOptions.exportNamespace}${key}`] = state + } + return states +} + +export interface ExportStatesOptions extends SerializeStatesOptions, GetStatesOptions { + globalName?: string + attachTo?: string +} + +export function exportStates (apolloClients: ApolloClients, options: ExportStatesOptions = {}) { + const finalOptions = Object.assign({}, { + globalName: '__APOLLO_STATE__', + attachTo: 'window', + useUnsafeSerializer: false, + }, options) + + return `${finalOptions.attachTo}.${finalOptions.globalName} = ${serializeStates(apolloClients, options)};` +} diff --git a/packages/vue-apollo-ssr/tsconfig.json b/packages/vue-apollo-ssr/tsconfig.json new file mode 100644 index 0000000..3fb6adb --- /dev/null +++ b/packages/vue-apollo-ssr/tsconfig.json @@ -0,0 +1,10 @@ +{ + "compilerOptions": { + "target": "es5", + "module": "commonjs", + "sourceMap": true, + }, + "include": [ + "src/**/*", + ], +} \ No newline at end of file