Skip to content

Commit 6d9d745

Browse files
aryaemami59aryaemami59
committed
Copy size-limit config from react-redux 
1 parent da2d76e commit 6d9d745

File tree

1 file changed

+124
-200
lines changed

1 file changed

+124
-200
lines changed

Diff for: ‎packages/toolkit/.size-limit.mts

+124-200
Original file line numberDiff line numberDiff line change
@@ -1,208 +1,132 @@
1-
const webpack = require('webpack')
2-
let { join } = require('path')
3-
4-
const esmSuffixes = ['modern.mjs' /*, 'browser.mjs', 'legacy-esm.js'*/]
5-
const cjsSuffixes = [/*'development.cjs',*/ 'production.min.cjs']
6-
7-
function withRtkPath(suffix, cjs = false) {
8-
/**
9-
* @param {string} name
10-
*/
11-
function alias(name) {
12-
return `${cjs ? 'cjs/' : ''}${name}.${suffix}`
13-
}
14-
/**
15-
* @param {webpack.Configuration} config
16-
*/
17-
return (config) => {
18-
config.plugins.push(
19-
new webpack.NormalModuleReplacementPlugin(
20-
/@reduxjs\/toolkit\/query\/react/,
21-
join(__dirname, 'dist/query/react/rtk-query-react.modern.mjs'),
22-
),
23-
new webpack.NormalModuleReplacementPlugin(
24-
/@reduxjs\/toolkit\/query/,
25-
join(__dirname, 'dist/query/rtk-query.modern.mjs'),
26-
),
27-
new webpack.NormalModuleReplacementPlugin(
28-
/@reduxjs\/toolkit\/react/,
29-
join(__dirname, 'dist/react/redux-toolkit-react.modern.mjs'),
30-
),
31-
new webpack.NormalModuleReplacementPlugin(
32-
/@reduxjs\/toolkit/,
33-
join(__dirname, 'dist/redux-toolkit.modern.mjs'),
34-
),
35-
new webpack.NormalModuleReplacementPlugin(
36-
/rtk-query-react.modern.mjs/,
37-
(r) => {
38-
const old = r.request
39-
r.request = r.request.replace(
40-
/rtk-query-react.modern.mjs$/,
41-
alias('rtk-query-react'),
42-
)
43-
//console.log(old, '=>', r.request)
44-
},
45-
),
46-
new webpack.NormalModuleReplacementPlugin(/rtk-query.modern.mjs/, (r) => {
47-
const old = r.request
48-
r.request = r.request.replace(
49-
/rtk-query.modern.mjs$/,
50-
alias('rtk-query'),
51-
)
52-
//console.log(old, '=>', r.request)
53-
}),
54-
new webpack.NormalModuleReplacementPlugin(
55-
/redux-toolkit-react.modern.mjs$/,
56-
(r) => {
57-
const old = r.request
58-
r.request = r.request.replace(
59-
/redux-toolkit-react.modern.mjs$/,
60-
alias('redux-toolkit-react'),
61-
)
62-
//console.log(old, '=>', r.request)
63-
},
64-
),
65-
new webpack.NormalModuleReplacementPlugin(
66-
/redux-toolkit.modern.mjs$/,
67-
(r) => {
68-
const old = r.request
69-
r.request = r.request.replace(
70-
/redux-toolkit.modern.mjs$/,
71-
alias('redux-toolkit'),
72-
)
73-
//console.log(old, '=>', r.request)
74-
},
75-
),
76-
)
1+
import type { Check, SizeLimitConfig } from 'size-limit'
2+
import type { Configuration } from 'webpack'
773

78-
if (suffix === 'production.min.cjs') {
79-
;(config.resolve ??= {}).mainFields = ['main', 'module']
80-
}
81-
;(config.optimization ??= {}).nodeEnv = 'production'
82-
return config
83-
}
84-
}
4+
/**
5+
* An array of all possible Node environments.
6+
*/
7+
const allNodeEnvs = ['production'] as const
858

86-
const ignoreAll = [
87-
'@reduxjs/toolkit',
88-
'@reduxjs/toolkit/query',
89-
'immer',
90-
'redux',
91-
'reselect',
92-
'redux-thunk',
93-
]
94-
95-
const entryPoints = [
96-
{
97-
name: `1. entry point: @reduxjs/toolkit`,
98-
path: 'dist/redux-toolkit.modern.mjs',
99-
},
100-
{
101-
name: `1. entry point: @reduxjs/toolkit/react`,
102-
path: 'dist/react/redux-toolkit-react.modern.mjs',
103-
},
104-
{
105-
name: `1. entry point: @reduxjs/toolkit/query`,
106-
path: 'dist/query/rtk-query.modern.mjs',
107-
},
108-
{
109-
name: `1. entry point: @reduxjs/toolkit/query/react`,
110-
path: 'dist/query/react/rtk-query-react.modern.mjs',
111-
},
112-
{
113-
name: `2. entry point: @reduxjs/toolkit (without dependencies)`,
114-
path: 'dist/redux-toolkit.modern.mjs',
115-
ignore: ignoreAll,
116-
},
117-
{
118-
name: `2. entry point: @reduxjs/toolkit/react (without dependencies)`,
119-
path: 'dist/react/redux-toolkit-react.modern.mjs',
120-
ignore: ignoreAll,
121-
},
122-
{
123-
name: `2. entry point: @reduxjs/toolkit/query (without dependencies)`,
124-
path: 'dist/query/rtk-query.modern.mjs',
125-
ignore: ignoreAll,
126-
},
127-
{
128-
name: `2. entry point: @reduxjs/toolkit/query/react (without dependencies)`,
129-
path: 'dist/query/react/rtk-query-react.modern.mjs',
130-
ignore: ignoreAll,
131-
},
132-
]
133-
134-
module.exports = entryPoints
135-
.flatMap((e) =>
136-
esmSuffixes.map((suffix) => ({
137-
...e,
138-
name: e.name + ` (${suffix})`,
139-
modifyWebpackConfig: withRtkPath(suffix),
140-
})),
141-
)
142-
.concat(
143-
entryPoints.flatMap((e) =>
144-
cjsSuffixes.map((suffix) => ({
145-
...e,
146-
name: e.name + ` (cjs, ${suffix})`,
147-
modifyWebpackConfig: withRtkPath(suffix, true),
148-
})),
149-
),
9+
/**
10+
* Represents a specific environment for a Node.js application.
11+
*/
12+
type NodeEnv = (typeof allNodeEnvs)[number]
13+
14+
/**
15+
* Gets all import configurations for a given entry point.
16+
* This function dynamically imports the specified entry point and
17+
* generates a size limit configuration for each named export found
18+
* within the module. It includes configurations for named imports,
19+
* wildcard imports, and the default import.
20+
*
21+
* @param entryPoint - The entry point to import.
22+
* @param index - The index of the entry point in the list.
23+
* @returns A promise that resolves to a size limit configuration object.
24+
*/
25+
const getAllImportsForEntryPoint = async (
26+
entryPoint: string,
27+
index: number,
28+
): Promise<SizeLimitConfig> => {
29+
const allNamedImports = Object.keys(await import(entryPoint)).filter(
30+
(namedImport) => namedImport !== 'default',
15031
)
151-
.concat(
152-
[
153-
{
154-
name: `3. createSlice`,
155-
import: { '@reduxjs/toolkit': '{ createSlice }' },
156-
},
157-
{
158-
name: `3. createAsyncThunk`,
159-
import: { '@reduxjs/toolkit': '{ createAsyncThunk }' },
160-
},
161-
{
162-
name: `3. buildCreateSlice and asyncThunkCreator`,
163-
import: {
164-
'@reduxjs/toolkit': '{ buildCreateSlice, asyncThunkCreator }',
165-
},
166-
},
167-
{
168-
name: `3. createEntityAdapter`,
169-
import: { '@reduxjs/toolkit': '{ createEntityAdapter }' },
170-
},
171-
{
172-
name: `3. configureStore`,
173-
import: { '@reduxjs/toolkit': '{ configureStore }' },
174-
},
175-
{
176-
name: `3. combineSlices`,
177-
import: { '@reduxjs/toolkit': '{ combineSlices }' },
178-
},
179-
{
180-
name: `3. createDynamicMiddleware`,
181-
import: { '@reduxjs/toolkit': '{ createDynamicMiddleware }' },
182-
},
183-
{
184-
name: `3. createDynamicMiddleware (react)`,
185-
import: { '@reduxjs/toolkit/react': '{ createDynamicMiddleware }' },
186-
},
187-
{
188-
name: `3. createListenerMiddleware`,
189-
import: { '@reduxjs/toolkit': '{ createListenerMiddleware }' },
190-
},
191-
{
192-
name: `3. createApi`,
193-
import: { '@reduxjs/toolkit/query': '{ createApi }' },
194-
},
32+
33+
return allNamedImports
34+
.map<Check>((namedImport) => ({
35+
path: entryPoint,
36+
name: `${index + 1}. import { ${namedImport} } from "${entryPoint}"`,
37+
import: `{ ${namedImport} }`,
38+
}))
39+
.concat([
19540
{
196-
name: `3. createApi (react)`,
197-
import: { '@reduxjs/toolkit/query/react': '{ createApi }' },
41+
path: entryPoint,
42+
name: `${index + 1}. import * from "${entryPoint}"`,
43+
import: '*',
19844
},
19945
{
200-
name: `3. fetchBaseQuery`,
201-
import: { '@reduxjs/toolkit/query': '{ fetchBaseQuery }' },
46+
path: entryPoint,
47+
name: `${index + 1}. import "${entryPoint}"`,
20248
},
203-
].map((e) => ({
204-
...e,
205-
name: e.name + ` (.modern.mjs)`,
206-
modifyWebpackConfig: withRtkPath('modern.mjs'),
207-
})),
49+
])
50+
}
51+
52+
/**
53+
* Sets the `NODE_ENV` for a given Webpack configuration.
54+
*
55+
* @param nodeEnv - The `NODE_ENV` to set (either 'development' or 'production').
56+
* @returns A function that modifies the Webpack configuration.
57+
*/
58+
const setNodeEnv = (nodeEnv: NodeEnv) => {
59+
const modifyWebpackConfig = ((config: Configuration) => {
60+
;(config.optimization ??= {}).nodeEnv = nodeEnv
61+
62+
return config
63+
}) satisfies Check['modifyWebpackConfig']
64+
65+
return modifyWebpackConfig
66+
}
67+
68+
/**
69+
* Gets all import configurations with a specified `NODE_ENV`.
70+
*
71+
* @param nodeEnv - The `NODE_ENV` to set (either 'development' or 'production').
72+
* @returns A promise that resolves to a size limit configuration object.
73+
*/
74+
const getAllImportsWithNodeEnv = async (nodeEnv: NodeEnv) => {
75+
const allPackageEntryPoints = [
76+
'./dist/redux-toolkit.modern.mjs',
77+
'./dist/react/redux-toolkit-react.modern.mjs',
78+
'./dist/query/rtk-query.modern.mjs',
79+
'./dist/query/react/rtk-query-react.modern.mjs',
80+
]
81+
82+
const allImportsFromAllEntryPoints = (
83+
await Promise.all(allPackageEntryPoints.map(getAllImportsForEntryPoint))
84+
).flat()
85+
86+
const modifyWebpackConfig = setNodeEnv(nodeEnv)
87+
88+
const allImportsWithNodeEnv = allImportsFromAllEntryPoints.map<Check>(
89+
(importsFromEntryPoint) => ({
90+
...importsFromEntryPoint,
91+
name: `${importsFromEntryPoint.name} ('${nodeEnv}' mode)`,
92+
modifyWebpackConfig,
93+
}),
20894
)
95+
96+
return allImportsWithNodeEnv
97+
}
98+
99+
/**
100+
* Gets the size limit configuration for all `NODE_ENV`s.
101+
*
102+
* @returns A promise that resolves to the size limit configuration object.
103+
*/
104+
const getSizeLimitConfig = async (): Promise<SizeLimitConfig> => {
105+
const packageJson = (
106+
await import('./package.json', { with: { type: 'json' } })
107+
).default
108+
109+
const sizeLimitConfig = (
110+
await Promise.all(allNodeEnvs.map(getAllImportsWithNodeEnv))
111+
).flat()
112+
113+
if ('dependencies' in packageJson) {
114+
const dependencies = Object.keys(packageJson.dependencies ?? {})
115+
116+
const sizeLimitConfigWithoutDependencies = sizeLimitConfig.map<Check>(
117+
(check) => ({
118+
...check,
119+
name: `${check.name} (excluding dependencies)`,
120+
ignore: dependencies,
121+
}),
122+
)
123+
124+
return sizeLimitConfigWithoutDependencies
125+
}
126+
127+
return sizeLimitConfig
128+
}
129+
130+
const sizeLimitConfig: Promise<SizeLimitConfig> = getSizeLimitConfig()
131+
132+
export default sizeLimitConfig

0 commit comments

Comments
 (0)