Skip to content

Commit 7efe96c

Browse files
WesSouzaarturbien
WesSouza
authored and
arturbien
committed
build: update build to preserve modules and use @rollup/plugin-typescript
This changes the main output to also preserve modules, allowing tree shaking when users build their projects. This also replaces rollup-plugin-dts with the more traditional @rollup/plugin-typescript, which exports type declarations for individual files fixing issues with themes imports.
1 parent f7103b9 commit 7efe96c

11 files changed

+125
-71
lines changed

‎package.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -74,6 +74,7 @@
7474
"@babel/plugin-transform-spread": "^7.18.9",
7575
"@babel/preset-env": "^7.18.10",
7676
"@babel/preset-typescript": "^7.18.6",
77+
"@rollup/plugin-typescript": "^8.3.4",
7778
"@storybook/addon-docs": "6.5.10",
7879
"@storybook/addon-storysource": "6.5.10",
7980
"@storybook/builder-webpack5": "^6.5.10",
@@ -115,7 +116,6 @@
115116
"rimraf": "^3.0.2",
116117
"rollup": "^2.77.2",
117118
"rollup-plugin-copy": "^3.4.0",
118-
"rollup-plugin-dts": "^4.2.2",
119119
"rollup-plugin-esbuild": "^4.9.1",
120120
"rollup-plugin-replace": "^2.2.0",
121121
"semantic-release": "^19.0.3",

‎rollup.config.js

+45-45
Original file line numberDiff line numberDiff line change
@@ -1,74 +1,74 @@
1-
import esbuild from 'rollup-plugin-esbuild';
1+
import typescript from '@rollup/plugin-typescript';
22
import copy from 'rollup-plugin-copy';
3-
import dts from 'rollup-plugin-dts';
3+
import esbuild from 'rollup-plugin-esbuild';
44
import replace from 'rollup-plugin-replace';
5-
import packageJson from './package.json';
65

76
const NODE_ENV = process.env.NODE_ENV || 'development';
87

9-
const bundle = config => [
10-
{
11-
...config,
12-
external: id => !/^[./]/.test(id),
13-
plugins: [
14-
...config.plugins,
15-
replace({
16-
'process.env.NODE_ENV': JSON.stringify(NODE_ENV)
17-
}),
18-
esbuild({ loaders: { '.js': 'jsx' } })
19-
]
20-
},
21-
{
22-
...config,
23-
output: config.output.dir
24-
? config.output
25-
: {
26-
file: packageJson.types,
27-
format: 'es'
28-
},
29-
external: id => !/^[./]/.test(id),
30-
plugins: [
31-
...config.plugins,
32-
replace({
33-
'process.env.NODE_ENV': JSON.stringify(NODE_ENV)
34-
}),
35-
dts()
36-
]
37-
}
38-
];
8+
const baseBundle = {
9+
external: id => !/^[./]/.test(id),
10+
plugins: [
11+
replace({
12+
'process.env.NODE_ENV': JSON.stringify(NODE_ENV)
13+
}),
14+
esbuild()
15+
]
16+
};
3917

4018
export default [
41-
...bundle({
42-
input: './src/index.ts',
19+
{
20+
...baseBundle,
21+
input: ['./src/index.ts', './src/types.ts'],
4322
output: [
4423
{
45-
file: packageJson.main,
24+
dir: 'dist',
25+
entryFileNames: '[name].js',
26+
exports: 'auto',
4627
format: 'cjs',
47-
sourcemap: true
28+
preserveModules: true,
29+
preserveModulesRoot: 'src'
4830
},
4931
{
50-
file: packageJson.module,
32+
dir: 'dist',
33+
entryFileNames: '[name].mjs',
34+
exports: 'auto',
5135
format: 'es',
52-
sourcemap: true
36+
preserveModules: true,
37+
preserveModulesRoot: 'src'
5338
}
5439
],
55-
plugins: []
56-
}),
57-
...bundle({
40+
plugins: [
41+
...baseBundle.plugins,
42+
typescript({
43+
tsconfig: './tsconfig.build.index.json',
44+
declaration: true,
45+
declarationDir: 'dist'
46+
})
47+
]
48+
},
49+
{
50+
...baseBundle,
5851
input: './src/common/themes/index.ts',
5952
output: {
6053
dir: 'dist/themes',
6154
exports: 'default',
62-
format: 'cjs'
55+
format: 'cjs',
56+
preserveModules: true,
57+
preserveModulesRoot: 'src/common/themes'
6358
},
64-
preserveModules: true,
6559
plugins: [
60+
...baseBundle.plugins,
6661
copy({
6762
targets: [
6863
{ src: './src/assets/fonts/dist/*', dest: './dist/fonts' },
6964
{ src: './src/assets/images/*', dest: './dist/images' }
7065
]
66+
}),
67+
typescript({
68+
tsconfig: './tsconfig.build.themes.json',
69+
declaration: true,
70+
declarationDir: 'dist/themes'
7171
})
7272
]
73-
})
73+
}
7474
];

‎src/Select/Select.tsx

+7-2
Original file line numberDiff line numberDiff line change
@@ -590,9 +590,14 @@ function SelectInner<T>(
590590
);
591591
}
592592

593+
/* eslint-disable no-use-before-define */
593594
const Select = forwardRef(SelectInner) as <T>(
594-
// eslint-disable-next-line no-use-before-define
595595
props: SelectProps<T> & { ref?: React.ForwardedRef<SelectRef> }
596-
) => ReturnType<typeof SelectInner>;
596+
) => ReturnType<typeof SelectInner<T>>;
597+
/* eslint-enable no-use-before-define */
598+
599+
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
600+
// @ts-ignore
601+
Select.displayName = 'Select';
597602

598603
export { Select, SelectProps };

‎src/Toolbar/Toolbar.tsx

+2
Original file line numberDiff line numberDiff line change
@@ -24,4 +24,6 @@ const Toolbar = forwardRef<HTMLDivElement, ToolbarProps>(function Toolbar(
2424
);
2525
});
2626

27+
Toolbar.displayName = 'Toolbar';
28+
2729
export { Toolbar };

‎src/TreeView/TreeView.tsx

+4-2
Original file line numberDiff line numberDiff line change
@@ -381,13 +381,15 @@ function TreeInner<T>(
381381
);
382382
}
383383

384+
/* eslint-disable no-use-before-define */
384385
const TreeView = forwardRef(TreeInner) as <T>(
385386
// eslint-disable-next-line no-use-before-define
386387
props: TreeViewProps<T> & { ref?: React.ForwardedRef<HTMLUListElement> }
387-
) => ReturnType<typeof TreeInner>;
388+
) => ReturnType<typeof TreeInner<T>>;
389+
/* eslint-enable no-use-before-define */
388390

389391
// eslint-disable-next-line @typescript-eslint/ban-ts-comment
390392
// @ts-ignore
391-
TreeView.displayProps = 'TreeView';
393+
TreeView.displayName = 'TreeView';
392394

393395
export { TreeView, TreeViewProps, TreeLeaf };

‎src/Window/WindowHeader.tsx

+2
Original file line numberDiff line numberDiff line change
@@ -46,4 +46,6 @@ const WindowHeader = forwardRef<HTMLDivElement, WindowHeaderProps>(
4646
}
4747
);
4848

49+
WindowHeader.displayName = 'WindowHeader';
50+
4951
export { WindowHeader, WindowHeaderProps };

‎src/types.tsx ‎src/types.ts

+2-2
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import React from 'react';
1+
import { ComponentType } from 'react';
22

33
import { Color, Theme, WindowsTheme } from './common/themes/types';
44

@@ -15,7 +15,7 @@ export type CommonStyledProps = {
1515
* "as" polymorphic prop allows to render a different HTML element or React component
1616
* @see {@link https://styled-components.com/docs/api#as-polymorphic-prop}
1717
*/
18-
as?: string | React.ComponentType<any>; // eslint-disable-line @typescript-eslint/no-explicit-any
18+
as?: string | ComponentType<any>; // eslint-disable-line @typescript-eslint/no-explicit-any
1919
};
2020

2121
export type CommonThemeProps = {

‎tsconfig.build.index.json

+20
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,20 @@
1+
{
2+
"extends": "./tsconfig.json",
3+
"compilerOptions": {
4+
"emitDeclarationOnly": true,
5+
"outDir": "./dist",
6+
"rootDir": "./src"
7+
},
8+
"include": [
9+
"types/global.d.ts",
10+
"types/themes.d.ts",
11+
"src/**/*.ts",
12+
"src/*/*.tsx"
13+
],
14+
"exclude": [
15+
"**/*.spec.ts",
16+
"**/*.spec.tsx",
17+
"**/*.stories.ts",
18+
"**/*.stories.tsx",
19+
]
20+
}

‎tsconfig.build.themes.json

+12
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
{
2+
"extends": "./tsconfig.json",
3+
"compilerOptions": {
4+
"emitDeclarationOnly": true,
5+
"outDir": "./dist/themes",
6+
"rootDir": "./src/common/themes",
7+
},
8+
"include": [
9+
"src/common/themes/*.ts",
10+
"src/common/themes/*.tsx"
11+
]
12+
}

‎tsconfig.json

+1-1
Original file line numberDiff line numberDiff line change
@@ -30,7 +30,7 @@
3030
"resolveJsonModule": true,
3131
"rootDir": "./",
3232
"skipLibCheck": true,
33-
"sourceMap": true,
33+
"sourceMap": false,
3434
"strict": true,
3535
"strictFunctionTypes": true,
3636
"strictNullChecks": true,

‎yarn.lock

+29-18
Original file line numberDiff line numberDiff line change
@@ -20,7 +20,7 @@
2020
call-me-maybe "^1.0.1"
2121
js-yaml "^4.1.0"
2222

23-
"@babel/code-frame@^7.0.0", "@babel/code-frame@^7.10.4", "@babel/code-frame@^7.12.13", "@babel/code-frame@^7.16.7", "@babel/code-frame@^7.18.6", "@babel/code-frame@^7.5.5", "@babel/code-frame@^7.8.3":
23+
"@babel/code-frame@^7.0.0", "@babel/code-frame@^7.10.4", "@babel/code-frame@^7.12.13", "@babel/code-frame@^7.18.6", "@babel/code-frame@^7.5.5", "@babel/code-frame@^7.8.3":
2424
version "7.18.6"
2525
resolved "https://registry.yarnpkg.com/@babel/code-frame/-/code-frame-7.18.6.tgz#3b25d38c89600baa2dcc219edfa88a74eb2c427a"
2626
integrity sha512-TDCmlK5eOvH+eH7cdAFlNXeVJqWIQ7gW9tY1GJIpUtFb6CmjVyq2VM3u71bOyR8CRihcCgMUYoDNyLXao3+70Q==
@@ -2112,6 +2112,23 @@
21122112
resolved "https://registry.yarnpkg.com/@protobufjs/utf8/-/utf8-1.1.0.tgz#a777360b5b39a1a2e5106f8e858f2fd2d060c570"
21132113
integrity sha512-Vvn3zZrhQZkkBE8LSuW3em98c0FwgO4nxzv6OdSxPKJIEKY2bGbHn+mhGIPerzI4twdxaP8/0+06HBpwf345Lw==
21142114

2115+
"@rollup/plugin-typescript@^8.3.4":
2116+
version "8.3.4"
2117+
resolved "https://registry.yarnpkg.com/@rollup/plugin-typescript/-/plugin-typescript-8.3.4.tgz#45cdc0787b658b37d0362c705d8de86bc8bc040e"
2118+
integrity sha512-wt7JnYE9antX6BOXtsxGoeVSu4dZfw0dU3xykfOQ4hC3EddxRbVG/K0xiY1Wup7QOHJcjLYXWAn0Kx9Z1SBHHg==
2119+
dependencies:
2120+
"@rollup/pluginutils" "^3.1.0"
2121+
resolve "^1.17.0"
2122+
2123+
"@rollup/pluginutils@^3.1.0":
2124+
version "3.1.0"
2125+
resolved "https://registry.yarnpkg.com/@rollup/pluginutils/-/pluginutils-3.1.0.tgz#706b4524ee6dc8b103b3c995533e5ad680c02b9b"
2126+
integrity sha512-GksZ6pr6TpIjHm8h9lSQ8pi8BE9VeubNT0OMJ3B5uZJ8pz73NPiqOtCog/x2/QzM1ENChPKxMDhiQuRHsqc+lg==
2127+
dependencies:
2128+
"@types/estree" "0.0.39"
2129+
estree-walker "^1.0.1"
2130+
picomatch "^2.2.2"
2131+
21152132
"@rollup/pluginutils@^4.1.1":
21162133
version "4.2.1"
21172134
resolved "https://registry.yarnpkg.com/@rollup/pluginutils/-/pluginutils-4.2.1.tgz#e6c6c3aba0744edce3fb2074922d3776c0af2a6d"
@@ -3118,6 +3135,11 @@
31183135
resolved "https://registry.yarnpkg.com/@types/estree/-/estree-1.0.0.tgz#5fb2e536c1ae9bf35366eed879e827fa59ca41c2"
31193136
integrity sha512-WulqXMDUTYAXCjZnk6JtIHPigp55cVtDgDrO2gHRwhyJto21+1zbVCtOYB2L1F9w4qCQ0rOGWBnBe0FNTiEJIQ==
31203137

3138+
"@types/[email protected]":
3139+
version "0.0.39"
3140+
resolved "https://registry.yarnpkg.com/@types/estree/-/estree-0.0.39.tgz#e177e699ee1b8c22d23174caaa7422644389509f"
3141+
integrity sha512-EYNwp3bU+98cpU4lAWYYL7Zz+2gryWH1qbdDTidVd6hkiR6weksdbMadyXKXNPEkQFhXM+hVO9ZygomHXp+AIw==
3142+
31213143
"@types/estree@^0.0.51":
31223144
version "0.0.51"
31233145
resolved "https://registry.yarnpkg.com/@types/estree/-/estree-0.0.51.tgz#cfd70924a25a3fd32b218e5e420e6897e1ac4f40"
@@ -7440,6 +7462,11 @@ estree-walker@^0.6.1:
74407462
resolved "https://registry.yarnpkg.com/estree-walker/-/estree-walker-0.6.1.tgz#53049143f40c6eb918b23671d1fe3219f3a1b362"
74417463
integrity sha512-SqmZANLWS0mnatqbSfRP5g8OXZC12Fgg1IwNtLsyHDzJizORW4khDfjPqJZsemPWBB2uqykUah5YpQ6epsqC/w==
74427464

7465+
estree-walker@^1.0.1:
7466+
version "1.0.1"
7467+
resolved "https://registry.yarnpkg.com/estree-walker/-/estree-walker-1.0.1.tgz#31bc5d612c96b704106b477e6dd5d8aa138cb700"
7468+
integrity sha512-1fMXF3YP4pZZVozF8j/ZLfvnR8NSIljt56UhbZ5PeeDmmGHpgpdwQt7ITlGvYaQukCvuBRMLEiKiYC+oeIg4cg==
7469+
74437470
estree-walker@^2.0.1:
74447471
version "2.0.2"
74457472
resolved "https://registry.yarnpkg.com/estree-walker/-/estree-walker-2.0.2.tgz#52f010178c2a4c117a7757cfe942adb7d2da4cac"
@@ -11415,13 +11442,6 @@ magic-string@^0.25.2:
1141511442
dependencies:
1141611443
sourcemap-codec "^1.4.8"
1141711444

11418-
magic-string@^0.26.1:
11419-
version "0.26.2"
11420-
resolved "https://registry.yarnpkg.com/magic-string/-/magic-string-0.26.2.tgz#5331700e4158cd6befda738bb6b0c7b93c0d4432"
11421-
integrity sha512-NzzlXpclt5zAbmo6h6jNc8zl2gNRGHvmsZW4IvZhTC4W7k4OlLP+S5YLussa/r3ixNT66KOQfNORlXHSOy/X4A==
11422-
dependencies:
11423-
sourcemap-codec "^1.4.8"
11424-
1142511445
make-dir@^2.0.0, make-dir@^2.1.0:
1142611446
version "2.1.0"
1142711447
resolved "https://registry.yarnpkg.com/make-dir/-/make-dir-2.1.0.tgz#5f0310e18b8be898cc07009295a30ae41e91e6f5"
@@ -14293,7 +14313,7 @@ resolve.exports@^1.1.0:
1429314313
resolved "https://registry.yarnpkg.com/resolve.exports/-/resolve.exports-1.1.0.tgz#5ce842b94b05146c0e03076985d1d0e7e48c90c9"
1429414314
integrity sha512-J1l+Zxxp4XK3LUDZ9m60LRJF/mAe4z6a4xyabPHk7pvK5t35dACV32iIjJDFeWZFfZlO29w6SZ67knR0tHzJtQ==
1429514315

14296-
resolve@^1.10.0, resolve@^1.14.2, resolve@^1.19.0, resolve@^1.20.0, resolve@^1.22.0, resolve@^1.3.2:
14316+
resolve@^1.10.0, resolve@^1.14.2, resolve@^1.17.0, resolve@^1.19.0, resolve@^1.20.0, resolve@^1.22.0, resolve@^1.3.2:
1429714317
version "1.22.1"
1429814318
resolved "https://registry.yarnpkg.com/resolve/-/resolve-1.22.1.tgz#27cb2ebb53f91abb49470a928bba7558066ac177"
1429914319
integrity sha512-nBpuuYuY5jFsli/JIs1oldw6fOQCBioohqWZg/2hiaOybXOft4lonv85uDOKXdf8rhyK159cxU5cDcK/NKk8zw==
@@ -14392,15 +14412,6 @@ rollup-plugin-copy@^3.4.0:
1439214412
globby "10.0.1"
1439314413
is-plain-object "^3.0.0"
1439414414

14395-
rollup-plugin-dts@^4.2.2:
14396-
version "4.2.2"
14397-
resolved "https://registry.yarnpkg.com/rollup-plugin-dts/-/rollup-plugin-dts-4.2.2.tgz#82876b8784213af29b02cf260b45e404ff835ce1"
14398-
integrity sha512-A3g6Rogyko/PXeKoUlkjxkP++8UDVpgA7C+Tdl77Xj4fgEaIjPSnxRmR53EzvoYy97VMVwLAOcWJudaVAuxneQ==
14399-
dependencies:
14400-
magic-string "^0.26.1"
14401-
optionalDependencies:
14402-
"@babel/code-frame" "^7.16.7"
14403-
1440414415
rollup-plugin-esbuild@^4.9.1:
1440514416
version "4.9.1"
1440614417
resolved "https://registry.yarnpkg.com/rollup-plugin-esbuild/-/rollup-plugin-esbuild-4.9.1.tgz#369d137e2b1542c8ee459495fd4f10de812666aa"

0 commit comments

Comments
 (0)