Skip to content

Commit b40b7c3

Browse files
DamianOsipiukDamianOsipiuk
authored
fix: umd build size, force prod devtools (#4074)
* fix: umd build size * fix: devtools force production
1 parent 2452ec1 commit b40b7c3

File tree

10 files changed

+75
-42
lines changed

10 files changed

+75
-42
lines changed

‎package.json

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -14,7 +14,8 @@
1414
"test:jest": "lerna run test:codemods --stream --no-bail && jest --config ./jest.config.ts",
1515
"test:jest:dev": "jest --config ./jest.config.ts --watch",
1616
"test:size": "npm run build && bundlewatch",
17-
"build": "rollup --config rollup.config.js && npm run typecheck",
17+
"build": "rollup --config rollup.config.js && npm run typecheck && npm run build:copyTypes",
18+
"build:copyTypes": "cp packages/react-query-devtools/build/lib/index.d.ts packages/react-query-devtools/build/lib/index.prod.d.ts",
1819
"typecheck": "tsc -b",
1920
"watch": "concurrently --kill-others \"rollup --config rollup.config.js -w\" \"npm run typecheck -- --watch\" \"npm run test\"",
2021
"linkAll": "lerna exec 'npm run link' --parallel",

‎packages/query-async-storage-persister/package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,7 @@
2020
},
2121
"./package.json": "./package.json"
2222
},
23+
"sideEffects": false,
2324
"files": [
2425
"build/lib/*",
2526
"build/umd/*",

‎packages/query-broadcast-client-experimental/package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,7 @@
2020
},
2121
"./package.json": "./package.json"
2222
},
23+
"sideEffects": false,
2324
"files": [
2425
"build/lib/*",
2526
"build/umd/*",

‎packages/query-core/package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,7 @@
2020
},
2121
"./package.json": "./package.json"
2222
},
23+
"sideEffects": false,
2324
"files": [
2425
"build/lib/*",
2526
"build/umd/*",

‎packages/query-sync-storage-persister/package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,7 @@
2020
},
2121
"./package.json": "./package.json"
2222
},
23+
"sideEffects": false,
2324
"files": [
2425
"build/lib/*",
2526
"build/umd/*",

‎packages/react-query-devtools/cjs.fallback.js

Lines changed: 0 additions & 13 deletions
This file was deleted.

‎packages/react-query-devtools/package.json

Lines changed: 9 additions & 14 deletions
Original file line numberDiff line numberDiff line change
@@ -14,37 +14,32 @@
1414
"main": "build/lib/index.js",
1515
"exports": {
1616
".": {
17-
"development": {
18-
"types": "./build/lib/index.d.ts",
19-
"import": "./build/lib/index.mjs",
20-
"default": "./build/lib/index.js"
21-
},
22-
"default": {
23-
"types": "./build/lib/index.d.ts",
24-
"import": "./build/lib/noop.mjs",
25-
"default": "./cjs.fallback.js"
26-
}
27-
},
28-
"./production": {
2917
"types": "./build/lib/index.d.ts",
3018
"import": "./build/lib/index.mjs",
3119
"default": "./build/lib/index.js"
3220
},
21+
"./build/lib/index.prod.js": {
22+
"types": "./build/lib/index.d.ts",
23+
"import": "./build/lib/index.prod.mjs",
24+
"default": "./build/lib/index.prod.js"
25+
},
3326
"./package.json": "./package.json"
3427
},
28+
"sideEffects": false,
3529
"files": [
3630
"build/lib/*",
3731
"build/umd/*",
38-
"cjs.fallback.js",
3932
"src"
4033
],
4134
"scripts": {
4235
"clean": "rm -rf ./build",
4336
"test:eslint": "../../node_modules/.bin/eslint --ext .ts,.tsx ./src"
4437
},
38+
"devDependencies": {
39+
"@types/use-sync-external-store": "^0.0.3"
40+
},
4541
"dependencies": {
4642
"@tanstack/match-sorter-utils": "^8.1.1",
47-
"@types/use-sync-external-store": "^0.0.3",
4843
"use-sync-external-store": "^1.2.0"
4944
},
5045
"peerDependencies": {

‎packages/react-query-persist-client/package.json

Lines changed: 1 addition & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -20,6 +20,7 @@
2020
},
2121
"./package.json": "./package.json"
2222
},
23+
"sideEffects": false,
2324
"files": [
2425
"build/lib/*",
2526
"build/umd/*",

‎packages/react-query/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -41,12 +41,12 @@
4141
],
4242
"devDependencies": {
4343
"@types/jscodeshift": "^0.11.3",
44+
"@types/use-sync-external-store": "^0.0.3",
4445
"jscodeshift": "^0.13.1",
4546
"react-error-boundary": "^3.1.4"
4647
},
4748
"dependencies": {
4849
"@tanstack/query-core": "4.3.0-beta.3",
49-
"@types/use-sync-external-store": "^0.0.3",
5050
"use-sync-external-store": "^1.2.0"
5151
},
5252
"peerDependencies": {

‎rollup.config.ts

Lines changed: 58 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -17,9 +17,10 @@ type Options = {
1717
jsName: string
1818
outputFile: string
1919
globals: Record<string, string>
20+
forceDevEnv: boolean
2021
}
2122

22-
const umdDevPlugin = (type: 'development' | 'production') =>
23+
const forceEnvPlugin = (type: 'development' | 'production') =>
2324
replace({
2425
'process.env.NODE_ENV': `"${type}"`,
2526
delimiters: ['', ''],
@@ -83,8 +84,12 @@ export default function rollup(options: RollupOptions): RollupOptions[] {
8384
react: 'React',
8485
'react-dom': 'ReactDOM',
8586
'@tanstack/query-core': 'QueryCore',
87+
'use-sync-external-store/shim/index.js': 'UseSyncExternalStore',
8688
},
87-
bundleUMDGlobals: ['@tanstack/query-core'],
89+
bundleUMDGlobals: [
90+
'@tanstack/query-core',
91+
'use-sync-external-store/shim/index.js',
92+
],
8893
}),
8994
...buildConfigs({
9095
name: 'react-query-devtools',
@@ -94,19 +99,31 @@ export default function rollup(options: RollupOptions): RollupOptions[] {
9499
entryFile: 'src/index.ts',
95100
globals: {
96101
react: 'React',
102+
'react-dom': 'ReactDOM',
97103
'@tanstack/react-query': 'ReactQuery',
104+
'@tanstack/match-sorter-utils': 'MatchSorterUtils',
105+
'use-sync-external-store/shim/index.js': 'UseSyncExternalStore',
98106
},
107+
bundleUMDGlobals: [
108+
'@tanstack/match-sorter-utils',
109+
'use-sync-external-store/shim/index.js',
110+
],
99111
}),
100112
...buildConfigs({
101-
name: 'react-query-devtools-noop',
113+
name: 'react-query-devtools-prod',
102114
packageDir: 'packages/react-query-devtools',
103115
jsName: 'ReactQueryDevtools',
104-
outputFile: 'noop',
105-
entryFile: 'src/noop.ts',
116+
outputFile: 'index.prod',
117+
entryFile: 'src/index.ts',
106118
globals: {
107119
react: 'React',
120+
'react-dom': 'ReactDOM',
108121
'@tanstack/react-query': 'ReactQuery',
122+
'@tanstack/match-sorter-utils': 'MatchSorterUtils',
123+
'use-sync-external-store/shim/index.js': 'UseSyncExternalStore',
109124
},
125+
forceDevEnv: true,
126+
skipUmdBuild: true,
110127
}),
111128
...buildConfigs({
112129
name: 'react-query-persist-client',
@@ -132,6 +149,9 @@ function buildConfigs(opts: {
132149
globals: Record<string, string>
133150
// This option allows to bundle specified dependencies for umd build
134151
bundleUMDGlobals?: string[]
152+
// Force prod env build
153+
forceDevEnv?: boolean
154+
skipUmdBuild?: boolean
135155
}): RollupOptions[] {
136156
const input = path.resolve(opts.packageDir, opts.entryFile)
137157
const externalDeps = Object.keys(opts.globals)
@@ -152,41 +172,65 @@ function buildConfigs(opts: {
152172
external,
153173
banner,
154174
globals: opts.globals,
175+
forceDevEnv: opts.forceDevEnv || false,
155176
}
156177

157-
return [esm(options), cjs(options), umdDev({...options, external: umdExternal}), umdProd({...options, external: umdExternal})]
178+
let builds = [esm(options), cjs(options)]
179+
180+
if (!opts.skipUmdBuild) {
181+
builds = builds.concat([
182+
umdDev({ ...options, external: umdExternal }),
183+
umdProd({ ...options, external: umdExternal }),
184+
])
185+
}
186+
187+
return builds
158188
}
159189

160-
function esm({ input, packageDir, external, banner }: Options): RollupOptions {
190+
function esm({
191+
input,
192+
packageDir,
193+
external,
194+
banner,
195+
outputFile,
196+
forceDevEnv,
197+
}: Options): RollupOptions {
161198
return {
162199
// ESM
163200
external,
164201
input,
165202
output: {
166203
format: 'esm',
167-
entryFileNames: '[name].mjs',
204+
file: `${packageDir}/build/lib/${outputFile}.mjs`,
168205
sourcemap: true,
169-
dir: `${packageDir}/build/lib`,
170206
banner,
171207
},
172208
plugins: [
173209
svelte(),
174210
babelPlugin,
175211
commonJS(),
176212
nodeResolve({ extensions: ['.ts', '.tsx'] }),
213+
forceDevEnv ? forceEnvPlugin('development') : undefined,
177214
],
178215
}
179216
}
180217

181-
function cjs({ input, external, packageDir, banner }: Options): RollupOptions {
218+
function cjs({
219+
input,
220+
external,
221+
packageDir,
222+
banner,
223+
outputFile,
224+
forceDevEnv,
225+
}: Options): RollupOptions {
182226
return {
183227
// CJS
184228
external,
185229
input,
186230
output: {
187231
format: 'cjs',
232+
file: `${packageDir}/build/lib/${outputFile}.js`,
188233
sourcemap: true,
189-
dir: `${packageDir}/build/lib`,
190234
exports: 'named',
191235
banner,
192236
},
@@ -195,6 +239,7 @@ function cjs({ input, external, packageDir, banner }: Options): RollupOptions {
195239
babelPlugin,
196240
commonJS(),
197241
nodeResolve({ extensions: ['.ts', '.tsx'] }),
242+
forceDevEnv ? forceEnvPlugin('development') : undefined,
198243
],
199244
}
200245
}
@@ -225,7 +270,7 @@ function umdDev({
225270
babelPlugin,
226271
nodeResolve({ extensions: ['.ts', '.tsx'] }),
227272
commonJS(),
228-
umdDevPlugin('development'),
273+
forceEnvPlugin('development'),
229274
],
230275
}
231276
}
@@ -256,7 +301,7 @@ function umdProd({
256301
babelPlugin,
257302
commonJS(),
258303
nodeResolve({ extensions: ['.ts', '.tsx'] }),
259-
umdDevPlugin('production'),
304+
forceEnvPlugin('production'),
260305
terser({
261306
mangle: true,
262307
compress: true,

0 commit comments

Comments
 (0)