From 4d7ebd86e31abf4da1d10f355df27a3efd46f32c Mon Sep 17 00:00:00 2001 From: Dimitri POSTOLOV Date: Sun, 8 Jun 2025 12:08:45 +0200 Subject: [PATCH 1/3] upd --- .gitignore | 6 +---- .../package.json | 2 +- .../vite.config.mts | 25 ++++++------------- .../graphiql-plugin-explorer/package.json | 2 +- .../graphiql-plugin-explorer/vite.config.mts | 22 ++++++---------- packages/graphiql/package.json | 9 +------ packages/graphiql/src/e2e.ts | 6 ++--- 7 files changed, 23 insertions(+), 49 deletions(-) diff --git a/.gitignore b/.gitignore index d2ac4afbd35..1b7064e3923 100644 --- a/.gitignore +++ b/.gitignore @@ -46,11 +46,7 @@ packages/codemirror-graphql/*.d.ts packages/codemirror-graphql/*.map !packages/codemirror-graphql/*.config.js -packages/graphiql/graphiql*.js -packages/graphiql/*.css -packages/graphiql/*.map packages/graphiql/cypress/screenshots/ +packages/graphiql/cypress/downloads/ packages/graphiql/typedoc/ packages/graphiql/webpack/ - -packages/graphiql/cypress/downloads/ diff --git a/packages/graphiql-plugin-code-exporter/package.json b/packages/graphiql-plugin-code-exporter/package.json index c78af9b6e0d..2c9a3890377 100644 --- a/packages/graphiql-plugin-code-exporter/package.json +++ b/packages/graphiql-plugin-code-exporter/package.json @@ -29,7 +29,7 @@ "scripts": { "types:check": "tsc --noEmit", "dev": "vite build --watch --emptyOutDir=false", - "build": "vite build && UMD=true vite build", + "build": "vite build", "postbuild": "cp src/graphiql-code-exporter.d.ts dist/graphiql-code-exporter.d.ts" }, "dependencies": { diff --git a/packages/graphiql-plugin-code-exporter/vite.config.mts b/packages/graphiql-plugin-code-exporter/vite.config.mts index 627e266b78f..48532f80c89 100644 --- a/packages/graphiql-plugin-code-exporter/vite.config.mts +++ b/packages/graphiql-plugin-code-exporter/vite.config.mts @@ -3,35 +3,26 @@ import react from '@vitejs/plugin-react'; import packageJSON from './package.json'; import dts from 'vite-plugin-dts'; -const IS_UMD = process.env.UMD === 'true'; - export default defineConfig({ - plugins: [ - react({ jsxRuntime: 'classic' }), - !IS_UMD && dts({ include: ['src/**'] }), - ], + plugins: [react({ jsxRuntime: 'classic' }), dts({ include: ['src/**'] })], css: { transformer: 'lightningcss', }, build: { - minify: IS_UMD - ? 'terser' // produce better bundle size than esbuild - : false, - // avoid clean cjs/es builds - emptyOutDir: !IS_UMD, + minify: false, lib: { entry: 'src/index.tsx', - fileName: (format, filePath) => - `${filePath}.${format === 'umd' ? 'umd.' : ''}js`, - name: 'GraphiQLPluginCodeExporter', - formats: IS_UMD ? ['umd'] : ['es'], + fileName: (_format, filePath) => `${filePath}.js`, + formats: ['es'], cssFileName: 'style', }, rollupOptions: { external: [ // Exclude peer dependencies and dependencies from bundle - ...Object.keys(packageJSON.peerDependencies), - ...(IS_UMD ? [] : Object.keys(packageJSON.dependencies)), + ...Object.keys({ + ...packageJSON.peerDependencies, + ...packageJSON.dependencies, + }), ], output: { globals: { diff --git a/packages/graphiql-plugin-explorer/package.json b/packages/graphiql-plugin-explorer/package.json index 9a0760336c0..025b0097718 100644 --- a/packages/graphiql-plugin-explorer/package.json +++ b/packages/graphiql-plugin-explorer/package.json @@ -28,7 +28,7 @@ "scripts": { "types:check": "tsc --noEmit", "dev": "vite build --watch --emptyOutDir=false", - "build": "vite build && UMD=true vite build", + "build": "vite build", "postbuild": "cp src/graphiql-explorer.d.ts dist/graphiql-explorer.d.ts" }, "dependencies": { diff --git a/packages/graphiql-plugin-explorer/vite.config.mts b/packages/graphiql-plugin-explorer/vite.config.mts index aa65e0ba7f0..94c724b074b 100644 --- a/packages/graphiql-plugin-explorer/vite.config.mts +++ b/packages/graphiql-plugin-explorer/vite.config.mts @@ -4,8 +4,6 @@ import svgr from 'vite-plugin-svgr'; import dts from 'vite-plugin-dts'; import packageJSON from './package.json'; -const IS_UMD = process.env.UMD === 'true'; - export default defineConfig({ plugins: [ react({ jsxRuntime: 'classic' }), @@ -14,30 +12,26 @@ export default defineConfig({ titleProp: true, }, }), - !IS_UMD && [dts({ include: ['src/**'] })], + dts({ include: ['src/**'] }), ], css: { transformer: 'lightningcss', }, build: { - minify: IS_UMD - ? 'terser' // produce better bundle size than esbuild - : false, - // avoid clean cjs/es builds - emptyOutDir: !IS_UMD, + minify: false, lib: { entry: 'src/index.tsx', - fileName: (format, filePath) => - `${filePath}.${format === 'umd' ? 'umd.' : ''}js`, - name: 'GraphiQLPluginExplorer', - formats: IS_UMD ? ['umd'] : ['es'], + fileName: (_format, filePath) => `${filePath}.js`, + formats: ['es'], cssFileName: 'style', }, rollupOptions: { external: [ // Exclude peer dependencies and dependencies from bundle - ...Object.keys(packageJSON.peerDependencies), - ...(IS_UMD ? [] : Object.keys(packageJSON.dependencies)), + ...Object.keys({ + ...packageJSON.peerDependencies, + ...packageJSON.dependencies, + }), ], output: { chunkFileNames: '[name].[format].js', diff --git a/packages/graphiql/package.json b/packages/graphiql/package.json index 88aae0d771f..aae90da8d7f 100644 --- a/packages/graphiql/package.json +++ b/packages/graphiql/package.json @@ -26,17 +26,11 @@ "files": [ "dist", "!dist/e2e.*", - "graphiql.js", - "graphiql.js.map", - "graphiql.min.js", - "graphiql.min.js.map", - "graphiql.css", - "graphiql.min.css" + "!dist/workers/*" ], "exports": { "./package.json": "./package.json", "./style.css": "./dist/style.css", - "./graphiql.css": "./dist/style.css", ".": "./dist/index.js", "./setup-workers/*": { "types": "./dist/setup-workers/*.d.ts", @@ -50,7 +44,6 @@ "dev": "concurrently 'cross-env PORT=8080 node test/e2e-server' vite", "e2e": "yarn e2e-server 'cypress run'", "e2e-server": "start-server-and-test 'cross-env PORT=8080 node test/e2e-server' 'http-get://localhost:8080/graphql?query={test { id }}'", - "prepublishOnly": "cp dist/index.umd.js graphiql.js && cp dist/index.umd.js.map graphiql.js.map && cp dist/index.umd.js graphiql.min.js && cp dist/index.umd.js.map graphiql.min.js.map && cp dist/style.css graphiql.css && cp dist/style.css graphiql.min.css", "test": "vitest" }, "dependencies": { diff --git a/packages/graphiql/src/e2e.ts b/packages/graphiql/src/e2e.ts index 9458b338c45..14b20331052 100644 --- a/packages/graphiql/src/e2e.ts +++ b/packages/graphiql/src/e2e.ts @@ -1,13 +1,13 @@ 'use no memo'; -import React from 'react'; +import React, { ComponentProps } from 'react'; import ReactDOM from 'react-dom/client'; import GraphiQL from './cdn'; import type { TabsState, Theme } from '@graphiql/react'; import './style.css'; /** - * UMD GraphiQL Example + * CDN GraphiQL Example * * This is a simple example that provides a primitive query string parser on top of GraphiQL props * It assumes a global umd GraphiQL, which would be provided by an index.html in the default example @@ -96,7 +96,7 @@ function getSchemaUrl(): string { const root = ReactDOM.createRoot(document.getElementById('graphiql')!); const graphqlVersion = GraphiQL.GraphQL.version; -const props = { +const props: ComponentProps = { fetcher: GraphiQL.createFetcher({ url: getSchemaUrl(), subscriptionUrl: 'ws://localhost:8081/subscriptions', From 56cc54a2c678bfb613a26a6b68473bc809f49097 Mon Sep 17 00:00:00 2001 From: Dimitri POSTOLOV Date: Sun, 8 Jun 2025 12:13:17 +0200 Subject: [PATCH 2/3] upd --- .../src/index.tsx | 2 +- .../src/vite-env.d.ts | 1 - .../tsconfig.json | 18 +----------------- .../vite.config.mts | 8 -------- 4 files changed, 2 insertions(+), 27 deletions(-) delete mode 100644 packages/graphiql-plugin-code-exporter/src/vite-env.d.ts diff --git a/packages/graphiql-plugin-code-exporter/src/index.tsx b/packages/graphiql-plugin-code-exporter/src/index.tsx index 6fd177d5126..faa5335c393 100644 --- a/packages/graphiql-plugin-code-exporter/src/index.tsx +++ b/packages/graphiql-plugin-code-exporter/src/index.tsx @@ -1,5 +1,5 @@ import { useOperationsEditorState, type GraphiQLPlugin } from '@graphiql/react'; -import React, { FC } from 'react'; +import { FC } from 'react'; import GraphiQLCodeExporter, { GraphiQLCodeExporterProps, } from 'graphiql-code-exporter'; diff --git a/packages/graphiql-plugin-code-exporter/src/vite-env.d.ts b/packages/graphiql-plugin-code-exporter/src/vite-env.d.ts deleted file mode 100644 index 11f02fe2a00..00000000000 --- a/packages/graphiql-plugin-code-exporter/src/vite-env.d.ts +++ /dev/null @@ -1 +0,0 @@ -/// diff --git a/packages/graphiql-plugin-code-exporter/tsconfig.json b/packages/graphiql-plugin-code-exporter/tsconfig.json index 2dd9b41294b..ee54eec68ce 100644 --- a/packages/graphiql-plugin-code-exporter/tsconfig.json +++ b/packages/graphiql-plugin-code-exporter/tsconfig.json @@ -1,19 +1,3 @@ { - "compilerOptions": { - "target": "ESNext", - "useDefineForClassFields": true, - "lib": ["DOM", "DOM.Iterable", "ESNext"], - "allowJs": false, - "skipLibCheck": true, - "esModuleInterop": false, - "allowSyntheticDefaultImports": true, - "strict": true, - "forceConsistentCasingInFileNames": true, - "module": "ESNext", - "moduleResolution": "Node", - "resolveJsonModule": true, - "isolatedModules": true, - "declaration": true, - "jsx": "react" - } + "extends": "../graphiql-react/tsconfig.json" } diff --git a/packages/graphiql-plugin-code-exporter/vite.config.mts b/packages/graphiql-plugin-code-exporter/vite.config.mts index 48532f80c89..46a1678791b 100644 --- a/packages/graphiql-plugin-code-exporter/vite.config.mts +++ b/packages/graphiql-plugin-code-exporter/vite.config.mts @@ -24,14 +24,6 @@ export default defineConfig({ ...packageJSON.dependencies, }), ], - output: { - globals: { - '@graphiql/react': 'GraphiQL.React', - graphql: 'GraphiQL.GraphQL', - react: 'React', - 'react-dom': 'ReactDOM', - }, - }, }, }, }); From 147d11adbc1837aec0602b34564220cb131c4c9b Mon Sep 17 00:00:00 2001 From: Dimitri POSTOLOV Date: Sun, 8 Jun 2025 12:21:49 +0200 Subject: [PATCH 3/3] upd --- .changeset/good-turtles-speak.md | 7 +++++++ .../src/index.tsx | 2 -- .../vite.config.mts | 3 ++- .../graphiql-plugin-explorer/src/index.tsx | 2 +- .../graphiql-plugin-explorer/tsconfig.json | 18 +----------------- .../graphiql-plugin-explorer/vite.config.mts | 16 ++-------------- 6 files changed, 13 insertions(+), 35 deletions(-) create mode 100644 .changeset/good-turtles-speak.md diff --git a/.changeset/good-turtles-speak.md b/.changeset/good-turtles-speak.md new file mode 100644 index 00000000000..074d1bfe29d --- /dev/null +++ b/.changeset/good-turtles-speak.md @@ -0,0 +1,7 @@ +--- +'@graphiql/plugin-code-exporter': major +'@graphiql/plugin-explorer': major +'graphiql': major +--- + +remove UMD builds diff --git a/packages/graphiql-plugin-code-exporter/src/index.tsx b/packages/graphiql-plugin-code-exporter/src/index.tsx index faa5335c393..74df1324f2c 100644 --- a/packages/graphiql-plugin-code-exporter/src/index.tsx +++ b/packages/graphiql-plugin-code-exporter/src/index.tsx @@ -3,8 +3,6 @@ import { FC } from 'react'; import GraphiQLCodeExporter, { GraphiQLCodeExporterProps, } from 'graphiql-code-exporter'; - -import './graphiql-code-exporter.d.ts'; import './index.css'; type GraphiQLCodeExporterPluginProps = Omit; diff --git a/packages/graphiql-plugin-code-exporter/vite.config.mts b/packages/graphiql-plugin-code-exporter/vite.config.mts index 46a1678791b..bffeeb91ee1 100644 --- a/packages/graphiql-plugin-code-exporter/vite.config.mts +++ b/packages/graphiql-plugin-code-exporter/vite.config.mts @@ -4,7 +4,7 @@ import packageJSON from './package.json'; import dts from 'vite-plugin-dts'; export default defineConfig({ - plugins: [react({ jsxRuntime: 'classic' }), dts({ include: ['src/**'] })], + plugins: [react(), dts({ include: ['src/**'] })], css: { transformer: 'lightningcss', }, @@ -18,6 +18,7 @@ export default defineConfig({ }, rollupOptions: { external: [ + 'react/jsx-runtime', // Exclude peer dependencies and dependencies from bundle ...Object.keys({ ...packageJSON.peerDependencies, diff --git a/packages/graphiql-plugin-explorer/src/index.tsx b/packages/graphiql-plugin-explorer/src/index.tsx index b4db982b8b3..73f4f6496f2 100644 --- a/packages/graphiql-plugin-explorer/src/index.tsx +++ b/packages/graphiql-plugin-explorer/src/index.tsx @@ -1,4 +1,4 @@ -import React, { CSSProperties, FC, useCallback } from 'react'; +import { CSSProperties, FC, useCallback } from 'react'; import { GraphiQLPlugin, useGraphiQL, diff --git a/packages/graphiql-plugin-explorer/tsconfig.json b/packages/graphiql-plugin-explorer/tsconfig.json index 2dd9b41294b..ee54eec68ce 100644 --- a/packages/graphiql-plugin-explorer/tsconfig.json +++ b/packages/graphiql-plugin-explorer/tsconfig.json @@ -1,19 +1,3 @@ { - "compilerOptions": { - "target": "ESNext", - "useDefineForClassFields": true, - "lib": ["DOM", "DOM.Iterable", "ESNext"], - "allowJs": false, - "skipLibCheck": true, - "esModuleInterop": false, - "allowSyntheticDefaultImports": true, - "strict": true, - "forceConsistentCasingInFileNames": true, - "module": "ESNext", - "moduleResolution": "Node", - "resolveJsonModule": true, - "isolatedModules": true, - "declaration": true, - "jsx": "react" - } + "extends": "../graphiql-react/tsconfig.json" } diff --git a/packages/graphiql-plugin-explorer/vite.config.mts b/packages/graphiql-plugin-explorer/vite.config.mts index 94c724b074b..72070a95d85 100644 --- a/packages/graphiql-plugin-explorer/vite.config.mts +++ b/packages/graphiql-plugin-explorer/vite.config.mts @@ -6,7 +6,7 @@ import packageJSON from './package.json'; export default defineConfig({ plugins: [ - react({ jsxRuntime: 'classic' }), + react(), svgr({ svgrOptions: { titleProp: true, @@ -27,25 +27,13 @@ export default defineConfig({ }, rollupOptions: { external: [ + 'react/jsx-runtime', // Exclude peer dependencies and dependencies from bundle ...Object.keys({ ...packageJSON.peerDependencies, ...packageJSON.dependencies, }), ], - output: { - chunkFileNames: '[name].[format].js', - globals: { - '@graphiql/react': 'GraphiQL.React', - graphql: 'GraphiQL.GraphQL', - react: 'React', - 'react-dom': 'ReactDOM', - }, - }, - }, - commonjsOptions: { - esmExternals: true, - requireReturnsDefault: 'auto', }, }, });