Skip to content

Commit

Permalink
fix: playground nexus typings (#9)
Browse files Browse the repository at this point in the history
  • Loading branch information
@Weakky
Weakky authored Oct 26, 2020
1 parent e9efd3f commit c180a6e
Show file tree
Hide file tree
Showing 17 changed files with 396,616 additions and 374,454 deletions.
34 changes: 17 additions & 17 deletions package.json
View file
Original file line number Diff line number Diff line change
Expand Up @@ -6,32 +6,32 @@
"author": "Flavian DESVERNE <[email protected]>",
"license": "MIT",
"dependencies": {
"@nexus/schema": "^0.13.1",
"@nexus/schema": "^0.16.0",
"dedent": "^0.7.0",
"graphql": "^14.5.8",
"monaco-editor": "^0.20.0",
"monaco-editor": "^0.21.2",
"react": "^16.7.0-alpha.2",
"react-dom": "^16.7.0-alpha.2"
},
"scripts": {
"dev": "ts-node-dev ./src/serve.ts",
"dev": "ts-node-dev --respawn ./src/serve.ts",
"build": "webpack",
"format": "prettier --write ./src/**/*.ts"
},
"devDependencies": {
"@babel/core": "^7.1.5",
"@babel/plugin-proposal-class-properties": "^7.1.0",
"@babel/plugin-proposal-object-rest-spread": "^7.0.0",
"@babel/preset-env": "^7.1.5",
"@babel/preset-react": "^7.0.0",
"@babel/preset-typescript": "^7.1.0",
"@babel/core": "^7.12.3",
"@babel/plugin-proposal-class-properties": "^7.12.1",
"@babel/plugin-proposal-object-rest-spread": "^7.12.1",
"@babel/preset-env": "^7.12.1",
"@babel/preset-react": "^7.12.1",
"@babel/preset-typescript": "^7.12.1",
"@prisma-labs/prettier-config": "^0.1.0",
"@types/dedent": "^0.7.0",
"@types/express": "^4.17.8",
"@types/json5": "^0.0.30",
"@types/lodash.debounce": "^4.0.4",
"@types/node": "^14.11.1",
"@types/react": "^16.7.6",
"@types/node": "^14.14.2",
"@types/react": "^16.9.53",
"@types/react-dom": "^16.0.9",
"@types/serve-index": "^1.7.30",
"@types/webpack": "^4.4.19",
Expand All @@ -45,17 +45,17 @@
"lodash.debounce": "^4.0.8",
"lodash.groupby": "^4.6.0",
"lz-string": "^1.4.4",
"monaco-editor-webpack-plugin": "^1.9.0",
"monaco-editor-webpack-plugin": "^2.0.0",
"raw-loader": "^3.1.0",
"react-split-pane": "^0.1.84",
"serve-index": "^1.9.1",
"style-loader": "^1.0.0",
"transit-js": "^0.8.861",
"ts-node": "^8.4.1",
"ts-node-dev": "^1.0.0-pre.62",
"typescript": "3.7.1-rc",
"ts-node": "^9.0.0",
"ts-node-dev": "^1.0.0",
"typescript": "4.0.3",
"use-debounce": "^3.1.0",
"webpack": "^4.44.2",
"webpack-cli": "^3.3.12"
"webpack": "^4.25.1",
"webpack-cli": "^3.1.2"
}
}
15 changes: 8 additions & 7 deletions src/playground/Playground.tsx
View file
Original file line number Diff line number Diff line change
@@ -1,7 +1,6 @@
import {
arg,
booleanArg,
core,
enumType,
floatArg,
idArg,
Expand All @@ -13,6 +12,8 @@ import {
stringArg,
unionType,
} from "@nexus/schema";
// `core` not imported by webpack when imported from the import above...
import * as core from "@nexus/schema/dist/core";
import { graphql, GraphQLSchema, lexicographicSortSchema } from "graphql";
import debounce from "lodash.debounce";
import * as monaco from "monaco-editor";
Expand All @@ -21,10 +22,13 @@ import React, {
useEffect,
useMemo,
useRef,
useState,
useState
} from "react";
import { useDebounce } from "use-debounce";
import "./monaco-config";
import { loadMonacoConfig } from './monaco-config';

loadMonacoConfig()

// import * as urlHash from "./urlHash";

interface GraphiQLProps {
Expand Down Expand Up @@ -101,10 +105,7 @@ export const Playground: React.SFC<PlaygroundProps> = (props) => {
useEffect(() => {
if (debouncedSchema) {
debouncedSchema.metadata
.generateTypesFile(debouncedSchema.schema, {
dynamicInputFields: {},
dynamicOutputField: {},
})
.generateTypesFile(debouncedSchema.schema as core.NexusGraphQLSchema, '')
.then((generated) => {
setGeneratedTypes(generated);
});
Expand Down
243 changes: 129 additions & 114 deletions src/playground/monaco-config.ts
View file
Original file line number Diff line number Diff line change
@@ -1,121 +1,136 @@
import * as monaco from 'monaco-editor'
import './monaco-graphql'

monaco.languages.typescript.typescriptDefaults.setCompilerOptions({
target: monaco.languages.typescript.ScriptTarget.ES2016,
allowNonTsExtensions: true,
moduleResolution: monaco.languages.typescript.ModuleResolutionKind.NodeJs,
module: monaco.languages.typescript.ModuleKind.CommonJS,
noEmit: true
})
export function loadMonacoConfig(): void {
monaco.languages.typescript.typescriptDefaults.setCompilerOptions({
target: monaco.languages.typescript.ScriptTarget.ES2016,
allowNonTsExtensions: true,
moduleResolution: monaco.languages.typescript.ModuleResolutionKind.NodeJs,
module: monaco.languages.typescript.ModuleKind.CommonJS,
noEmit: true,
})

const allTypeDefs = [
require('raw-loader!graphql/index.d.ts'),
require('raw-loader!graphql/graphql.d.ts'),
require('raw-loader!graphql/type/definition.d.ts'),
require('raw-loader!graphql/type/directives.d.ts'),
require('raw-loader!graphql/type/index.d.ts'),
require('raw-loader!graphql/type/introspection.d.ts'),
require('raw-loader!graphql/type/scalars.d.ts'),
require('raw-loader!graphql/type/schema.d.ts'),
require('raw-loader!graphql/type/validate.d.ts'),
require('raw-loader!@nexus/schema/dist/blocks.d.ts'),
require('raw-loader!@nexus/schema/dist/builder.d.ts'),
require('raw-loader!@nexus/schema/dist/core.d.ts'),
require('raw-loader!@nexus/schema/dist/dynamicMethod.d.ts'),
require('raw-loader!@nexus/schema/dist/dynamicProperty.d.ts'),
require('raw-loader!@nexus/schema/dist/extensions.d.ts'),
require('raw-loader!@nexus/schema/dist/index.d.ts'),
require('raw-loader!@nexus/schema/dist/lang.d.ts'),
require('raw-loader!@nexus/schema/dist/plugin.d.ts'),
require('raw-loader!@nexus/schema/dist/sdlConverter.d.ts'),
require('raw-loader!@nexus/schema/dist/typegenAutoConfig.d.ts'),
require('raw-loader!@nexus/schema/dist/typegenFormatPrettier.d.ts'),
require('raw-loader!@nexus/schema/dist/typegenMetadata.d.ts'),
require('raw-loader!@nexus/schema/dist/typegenPrinter.d.ts'),
require('raw-loader!@nexus/schema/dist/typegenTypeHelpers.d.ts'),
require('raw-loader!@nexus/schema/dist/utils.d.ts'),
require('raw-loader!@nexus/schema/dist/definitions/_types.d.ts'),
require('raw-loader!@nexus/schema/dist/definitions/args.d.ts'),
require('raw-loader!@nexus/schema/dist/definitions/decorateType.d.ts'),
require('raw-loader!@nexus/schema/dist/definitions/definitionBlocks.d.ts'),
require('raw-loader!@nexus/schema/dist/definitions/enumType.d.ts'),
require('raw-loader!@nexus/schema/dist/definitions/extendInputType.d.ts'),
require('raw-loader!@nexus/schema/dist/definitions/extendType.d.ts'),
require('raw-loader!@nexus/schema/dist/definitions/inputObjectType.d.ts'),
require('raw-loader!@nexus/schema/dist/definitions/interfaceType.d.ts'),
require('raw-loader!@nexus/schema/dist/definitions/mutationField.d.ts'),
require('raw-loader!@nexus/schema/dist/definitions/objectType.d.ts'),
require('raw-loader!@nexus/schema/dist/definitions/queryField.d.ts'),
require('raw-loader!@nexus/schema/dist/definitions/scalarType.d.ts'),
require('raw-loader!@nexus/schema/dist/definitions/subscriptionField.d.ts'),
require('raw-loader!@nexus/schema/dist/definitions/unionType.d.ts'),
require('raw-loader!@nexus/schema/dist/definitions/wrapping.d.ts'),
require('raw-loader!@nexus/schema/dist/dynamicMethods/collection.d.ts'),
require('raw-loader!@nexus/schema/dist/dynamicMethods/index.d.ts'),
require('raw-loader!@nexus/schema/dist/dynamicMethods/relayConnection.d.ts'),
require('raw-loader!@nexus/schema/dist/plugins/fieldAuthorizePlugin.d.ts'),
require('raw-loader!@nexus/schema/dist/plugins/index.d.ts'),
require('raw-loader!@nexus/schema/dist/plugins/nullabilityGuardPlugin.d.ts')
]
const allTypeDefs = [
require('raw-loader!graphql/index.d.ts'),
require('raw-loader!graphql/graphql.d.ts'),
require('raw-loader!graphql/type/definition.d.ts'),
require('raw-loader!graphql/type/directives.d.ts'),
require('raw-loader!graphql/type/index.d.ts'),
require('raw-loader!graphql/type/introspection.d.ts'),
require('raw-loader!graphql/type/scalars.d.ts'),
require('raw-loader!graphql/type/schema.d.ts'),
require('raw-loader!graphql/type/validate.d.ts'),
require('raw-loader!@nexus/schema/dist/blocks.d.ts'),
require('raw-loader!@nexus/schema/dist/builder.d.ts'),
require('raw-loader!@nexus/schema/dist/core.d.ts'),
require('raw-loader!@nexus/schema/dist/definitions/_types.d.ts'),
require('raw-loader!@nexus/schema/dist/definitions/args.d.ts'),
require('raw-loader!@nexus/schema/dist/definitions/decorateType.d.ts'),
require('raw-loader!@nexus/schema/dist/definitions/definitionBlocks.d.ts'),
require('raw-loader!@nexus/schema/dist/definitions/enumType.d.ts'),
require('raw-loader!@nexus/schema/dist/definitions/extendInputType.d.ts'),
require('raw-loader!@nexus/schema/dist/definitions/extendType.d.ts'),
require('raw-loader!@nexus/schema/dist/definitions/inputObjectType.d.ts'),
require('raw-loader!@nexus/schema/dist/definitions/interfaceType.d.ts'),
require('raw-loader!@nexus/schema/dist/definitions/mutationField.d.ts'),
require('raw-loader!@nexus/schema/dist/definitions/objectType.d.ts'),
require('raw-loader!@nexus/schema/dist/definitions/queryField.d.ts'),
require('raw-loader!@nexus/schema/dist/definitions/scalarType.d.ts'),
require('raw-loader!@nexus/schema/dist/definitions/subscriptionField.d.ts'),
require('raw-loader!@nexus/schema/dist/definitions/subscriptionType.d.ts'),
require('raw-loader!@nexus/schema/dist/definitions/unionType.d.ts'),
require('raw-loader!@nexus/schema/dist/definitions/wrapping.d.ts'),
require('raw-loader!@nexus/schema/dist/dynamicMethod.d.ts'),
require('raw-loader!@nexus/schema/dist/dynamicMethods/collection.d.ts'),
require('raw-loader!@nexus/schema/dist/dynamicMethods/index.d.ts'),
require('raw-loader!@nexus/schema/dist/dynamicMethods/relayConnection.d.ts'),
require('raw-loader!@nexus/schema/dist/dynamicProperty.d.ts'),
require('raw-loader!@nexus/schema/dist/extensions.d.ts'),
require('raw-loader!@nexus/schema/dist/index.d.ts'),
require('raw-loader!@nexus/schema/dist/lang.d.ts'),
require('raw-loader!@nexus/schema/dist/plugin.d.ts'),
require('raw-loader!@nexus/schema/dist/plugins/connectionPlugin.d.ts'),
require('raw-loader!@nexus/schema/dist/plugins/fieldAuthorizePlugin.d.ts'),
require('raw-loader!@nexus/schema/dist/plugins/index.d.ts'),
require('raw-loader!@nexus/schema/dist/plugins/nullabilityGuardPlugin.d.ts'),
require('raw-loader!@nexus/schema/dist/plugins/queryComplexityPlugin.d.ts'),
require('raw-loader!@nexus/schema/dist/sdlConverter.d.ts'),
require('raw-loader!@nexus/schema/dist/typegenAutoConfig.d.ts'),
require('raw-loader!@nexus/schema/dist/typegenFormatPrettier.d.ts'),
require('raw-loader!@nexus/schema/dist/typegenMetadata.d.ts'),
require('raw-loader!@nexus/schema/dist/typegenPrinter.d.ts'),
require('raw-loader!@nexus/schema/dist/typegenTypeHelpers.d.ts'),
require('raw-loader!@nexus/schema/dist/typegenUtils.d.ts'),
require('raw-loader!@nexus/schema/dist/utils.d.ts'),
]

const files = [
'graphql/index.d.ts',
'graphql/graphql.d.ts',
'graphql/type/definition.d.ts',
'graphql/type/directives.d.ts',
'graphql/type/index.d.ts',
'graphql/type/introspection.d.ts',
'graphql/type/scalars.d.ts',
'graphql/type/schema.d.ts',
'graphql/type/validate.d.ts',
'nexus/blocks.d.ts',
'nexus/builder.d.ts',
'nexus/core.d.ts',
'nexus/dynamicMethod.d.ts',
'nexus/dynamicProperty.d.ts',
'nexus/extensions.d.ts',
'nexus/index.d.ts',
'nexus/lang.d.ts',
'nexus/plugin.d.ts',
'nexus/sdlConverter.d.ts',
'nexus/typegenAutoConfig.d.ts',
'nexus/typegenFormatPrettier.d.ts',
'nexus/typegenMetadata.d.ts',
'nexus/typegenPrinter.d.ts',
'nexus/typegenTypeHelpers.d.ts',
'nexus/utils.d.ts',
'nexus/definitions/_types.d.ts',
'nexus/definitions/args.d.ts',
'nexus/definitions/decorateType.d.ts',
'nexus/definitions/definitionBlocks.d.ts',
'nexus/definitions/enumType.d.ts',
'nexus/definitions/extendInputType.d.ts',
'nexus/definitions/extendType.d.ts',
'nexus/definitions/inputObjectType.d.ts',
'nexus/definitions/interfaceType.d.ts',
'nexus/definitions/mutationField.d.ts',
'nexus/definitions/objectType.d.ts',
'nexus/definitions/queryField.d.ts',
'nexus/definitions/scalarType.d.ts',
'nexus/definitions/subscriptionField.d.ts',
'nexus/definitions/unionType.d.ts',
'nexus/definitions/wrapping.d.ts',
'nexus/dynamicMethods/collection.d.ts',
'nexus/dynamicMethods/index.d.ts',
'nexus/dynamicMethods/relayConnection.d.ts',
'nexus/plugins/fieldAuthorizePlugin.d.ts',
'nexus/plugins/index.d.ts',
'nexus/plugins/nullabilityGuardPlugin.d.ts'
]
/**
* DO NOT RENAME `nexus` to `@nexus/schema`. It seems to prevent monaco editor from finding the type defs
*/
const files = [
'graphql/index.d.ts',
'graphql/graphql.d.ts',
'graphql/type/definition.d.ts',
'graphql/type/directives.d.ts',
'graphql/type/index.d.ts',
'graphql/type/introspection.d.ts',
'graphql/type/scalars.d.ts',
'graphql/type/schema.d.ts',
'graphql/type/validate.d.ts',
'nexus/blocks.d.ts',
'nexus/builder.d.ts',
'nexus/core.d.ts',
'nexus/definitions/_types.d.ts',
'nexus/definitions/args.d.ts',
'nexus/definitions/decorateType.d.ts',
'nexus/definitions/definitionBlocks.d.ts',
'nexus/definitions/enumType.d.ts',
'nexus/definitions/extendInputType.d.ts',
'nexus/definitions/extendType.d.ts',
'nexus/definitions/inputObjectType.d.ts',
'nexus/definitions/interfaceType.d.ts',
'nexus/definitions/mutationField.d.ts',
'nexus/definitions/objectType.d.ts',
'nexus/definitions/queryField.d.ts',
'nexus/definitions/scalarType.d.ts',
'nexus/definitions/subscriptionField.d.ts',
'nexus/definitions/subscriptionType.d.ts',
'nexus/definitions/unionType.d.ts',
'nexus/definitions/wrapping.d.ts',
'nexus/dynamicMethod.d.ts',
'nexus/dynamicMethods/collection.d.ts',
'nexus/dynamicMethods/index.d.ts',
'nexus/dynamicMethods/relayConnection.d.ts',
'nexus/dynamicProperty.d.ts',
'nexus/extensions.d.ts',
'nexus/index.d.ts',
'nexus/lang.d.ts',
'nexus/plugin.d.ts',
'nexus/plugins/connectionPlugin.d.ts',
'nexus/plugins/fieldAuthorizePlugin.d.ts',
'nexus/plugins/index.d.ts',
'nexus/plugins/nullabilityGuardPlugin.d.ts',
'nexus/plugins/queryComplexityPlugin.d.ts',
'nexus/sdlConverter.d.ts',
'nexus/typegenAutoConfig.d.ts',
'nexus/typegenFormatPrettier.d.ts',
'nexus/typegenMetadata.d.ts',
'nexus/typegenPrinter.d.ts',
'nexus/typegenTypeHelpers.d.ts',
'nexus/typegenUtils.d.ts',
'nexus/utils.d.ts',
]

files.forEach((file, i) => {
monaco.languages.typescript.typescriptDefaults.addExtraLib(allTypeDefs[i], `file:///node_modules/${file}`)
})
files.forEach((file, i) => {
monaco.languages.typescript.typescriptDefaults.addExtraLib(
allTypeDefs[i].default,
`file:///node_modules/${file}`
)
})

monaco.languages.typescript.typescriptDefaults.addExtraLib(
`
import * as nexus from '@nexus/schema'
monaco.languages.typescript.typescriptDefaults.addExtraLib(
`
import * as nexus from 'nexus'
// Re-export these so we can use globally in the sandbox
// while still preserving the typegen
Expand All @@ -130,11 +145,11 @@ declare global {
declare const enumType: typeof nexus.enumType;
declare const unionType: typeof nexus.unionType;
declare const scalarType: typeof nexus.scalarType;
declare const directiveType: typeof nexus.directiveType;
declare const objectType: typeof nexus.objectType;
declare const interfaceType: typeof nexus.interfaceType;
declare const inputObjectType: typeof nexus.inputObjectType;
}
`,
'file:///sandbox-globals.ts'
)
'file:///sandbox-globals.ts'
)
}
Loading

0 comments on commit c180a6e

Please sign in to comment.