Skip to content

Commit 817e9bd

Browse files
wise-king-sullymanwise-king-sullyman
authored
bug(build): fixed built ESM files importing CJS files from react-styles (#9347)
* bug(build): fixed built ESM files importing CJS files from react-styles * edited yarn.lock to invalidate deps cache in GH actions * excluded file extensions from react-styles path transform in ESM build * updated jest config to transform .mjs files * updated pr action to invalidate deps cache if package files added/edited * chore(deps): Add ts-node to support executing typescript files directly
1 parent a772c6d commit 817e9bd

File tree

7 files changed

+140
-6
lines changed

7 files changed

+140
-6
lines changed

‎.github/workflows/pr-preview.yml

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -26,7 +26,7 @@ jobs:
2626
node_modules
2727
**/node_modules
2828
~/.cache/Cypress
29-
key: ${{ runner.os }}-yarn-14-${{ secrets.CACHE_VERSION }}-${{ hashFiles('yarn.lock') }}
29+
key: ${{ runner.os }}-yarn-14-${{ secrets.CACHE_VERSION }}-${{ hashFiles('yarn.lock', 'packages/*/package.json') }}
3030
- run: yarn install --frozen-lockfile
3131
if: steps.yarn-cache.outputs.cache-hit != 'true'
3232
- uses: actions/cache@v2

‎jest.config.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -10,7 +10,7 @@ module.exports = {
1010
],
1111
roots: ['<rootDir>/packages'],
1212
transform: {
13-
'^.+\\.[jt]sx?$': 'babel-jest',
13+
'^.+\\.m?[jt]sx?$': 'babel-jest',
1414
'^.+\\.svg$': 'jest-transform-stub'
1515
},
1616
setupFilesAfterEnv: ['<rootDir>/packages/testSetup.ts'],

‎package.json

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -64,7 +64,8 @@
6464
"react-dom": "^18",
6565
"surge": "^0.23.1",
6666
"ts-patch": "^2.1.0",
67-
"typescript": "^4.7.4"
67+
"typescript": "^4.7.4",
68+
"ts-node": "^10.9.1"
6869
},
6970
"scripts": {
7071
"build": "yarn clean && yarn build:generate && yarn build:esm && yarn build:cjs && yarn build:subpaths && yarn build:single:packages",

‎packages/transformer-react-styles-esm-imports/index.ts

Lines changed: 36 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,36 @@
1+
// https://levelup.gitconnected.com/writing-typescript-custom-ast-transformer-part-2-5322c2b1660e
2+
import * as ts from 'typescript';
3+
4+
const transformer: ts.TransformerFactory<ts.SourceFile> = (context) => (sourceFile) => {
5+
// Only transform for ESM build
6+
// ESM: module = 5, CJS: module = 1
7+
if (context.getCompilerOptions().module !== 5) {
8+
return sourceFile;
9+
}
10+
11+
/** @type { import("typescript").Visitor } */
12+
function visitor(node: ts.Node) {
13+
const { factory } = context;
14+
if (ts.isImportDeclaration(node)) {
15+
const text = node.moduleSpecifier.getFullText(sourceFile);
16+
17+
// Only transform imports from react-styles/css
18+
// Exclude anything that already has an explicit file extension
19+
if (/@patternfly\/react-styles\/css/.test(text) && !/\.[a-z]{1,5}('|");?$/.test(text)) {
20+
return factory.updateImportDeclaration(
21+
node,
22+
node.decorators,
23+
node.modifiers,
24+
node.importClause,
25+
factory.createStringLiteral(text.trim().replace(/"|'/g, '').replace(/$/, '.mjs'), true),
26+
undefined
27+
);
28+
}
29+
}
30+
31+
return ts.visitEachChild(node, visitor, context);
32+
}
33+
return ts.visitNode(sourceFile, visitor);
34+
};
35+
36+
module.exports = transformer;

‎packages/transformer-react-styles-esm-imports/package.json

Lines changed: 12 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,12 @@
1+
{
2+
"name": "transformer-react-styles-esm-imports",
3+
"private": true,
4+
"version": "1.0.0",
5+
"description": "Transform react-styles/css imports to target mjs files when compiling to ESM.",
6+
"main": "index.ts",
7+
"author": "Red Hat",
8+
"license": "MIT",
9+
"peerDependencies": {
10+
"typescript": ">=3.7.2"
11+
}
12+
}

‎packages/tsconfig.base.json

Lines changed: 2 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -19,7 +19,8 @@
1919
"strictNullChecks": false,
2020
"isolatedModules": true,
2121
"plugins": [
22-
{ "transform": "transformer-cjs-imports" }
22+
{ "transform": "transformer-cjs-imports" },
23+
{ "transform": "transformer-react-styles-esm-imports/index.ts", "type": "raw" }
2324
]
2425
},
2526
"exclude": [

‎yarn.lock

Lines changed: 86 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2876,6 +2876,13 @@
28762876
resolved "https://registry.npmjs.org/@bcoe/v8-coverage/-/v8-coverage-0.2.3.tgz"
28772877
integrity sha512-0hYQ8SB4Db5zvZB4axdMHGwEaQjkZzFjQiN9LVYvIFB2nSUHW9tYpxWriPrWDASIxiaXax83REcLxuSdnGPZtw==
28782878

2879+
"@cspotcode/source-map-support@^0.8.0":
2880+
version "0.8.1"
2881+
resolved "https://registry.yarnpkg.com/@cspotcode/source-map-support/-/source-map-support-0.8.1.tgz#00629c35a688e05a88b1cda684fb9d5e73f000a1"
2882+
integrity sha512-IchNf6dN4tHoMFIn/7OE8LWZ19Y6q/67Bmf6vnGREv8RSbBVb9LPJxEcnwrcwX6ixSvaiGoomAUvu4YSxXrVgw==
2883+
dependencies:
2884+
"@jridgewell/trace-mapping" "0.3.9"
2885+
28792886
"@cypress/request@^2.88.6":
28802887
version "2.88.6"
28812888
resolved "https://registry.npmjs.org/@cypress/request/-/request-2.88.6.tgz"
@@ -3251,7 +3258,7 @@
32513258
resolved "https://registry.yarnpkg.com/@jridgewell/resolve-uri/-/resolve-uri-3.1.0.tgz#2203b118c157721addfe69d47b70465463066d78"
32523259
integrity sha512-F2msla3tad+Mfht5cJq7LSXcdudKTWCVYUgw6pLFOOHSTtZlj6SWNYAp+AhuqLmWdBO2X5hPrLcu8cVP8fy28w==
32533260

3254-
"@jridgewell/resolve-uri@^3.1.0":
3261+
"@jridgewell/resolve-uri@^3.0.3", "@jridgewell/resolve-uri@^3.1.0":
32553262
version "3.1.1"
32563263
resolved "https://registry.yarnpkg.com/@jridgewell/resolve-uri/-/resolve-uri-3.1.1.tgz#c08679063f279615a3326583ba3a90d1d82cc721"
32573264
integrity sha512-dSYZh7HhCDtCKm4QakX0xFpsRDqjjtZf/kjI/v3T3Nwt5r8/qz/M19F9ySyOqU94SXBmeG9ttTul+YnR4LOxFA==
@@ -3279,6 +3286,14 @@
32793286
resolved "https://registry.yarnpkg.com/@jridgewell/sourcemap-codec/-/sourcemap-codec-1.4.15.tgz#d7c6e6755c78567a951e04ab52ef0fd26de59f32"
32803287
integrity sha512-eF2rxCRulEKXHTRiDrDy6erMYWqNw4LPdQ8UQA4huuxaQsVeRPFl2oM8oDGxMFhJUWZf9McpLtJasDDZb/Bpeg==
32813288

3289+
"@jridgewell/[email protected]":
3290+
version "0.3.9"
3291+
resolved "https://registry.yarnpkg.com/@jridgewell/trace-mapping/-/trace-mapping-0.3.9.tgz#6534fd5933a53ba7cbf3a17615e273a0d1273ff9"
3292+
integrity sha512-3Belt6tdc8bPgAtbcmdtNJlirVoTmEb5e2gC94PnkwEW9jI6CAHUeoG85tjWP5WquqfavoMtMwiG4P926ZKKuQ==
3293+
dependencies:
3294+
"@jridgewell/resolve-uri" "^3.0.3"
3295+
"@jridgewell/sourcemap-codec" "^1.4.10"
3296+
32823297
"@jridgewell/trace-mapping@^0.3.14":
32833298
version "0.3.17"
32843299
resolved "https://registry.yarnpkg.com/@jridgewell/trace-mapping/-/trace-mapping-0.3.17.tgz#793041277af9073b0951a7fe0f0d8c4c98c36985"
@@ -4112,6 +4127,26 @@
41124127
resolved "https://registry.yarnpkg.com/@tootallnate/once/-/once-2.0.0.tgz#f544a148d3ab35801c1f633a7441fd87c2e484bf"
41134128
integrity sha512-XCuKFP5PS55gnMVu3dty8KPatLqUoy/ZYzDzAGCQ8JNFCkLXzmI7vNHCR+XpbZaMWQK/vQubr7PkYq8g470J/A==
41144129

4130+
"@tsconfig/node10@^1.0.7":
4131+
version "1.0.9"
4132+
resolved "https://registry.yarnpkg.com/@tsconfig/node10/-/node10-1.0.9.tgz#df4907fc07a886922637b15e02d4cebc4c0021b2"
4133+
integrity sha512-jNsYVVxU8v5g43Erja32laIDHXeoNvFEpX33OK4d6hljo3jDhCBDhx5dhCCTMWUojscpAagGiRkBKxpdl9fxqA==
4134+
4135+
"@tsconfig/node12@^1.0.7":
4136+
version "1.0.11"
4137+
resolved "https://registry.yarnpkg.com/@tsconfig/node12/-/node12-1.0.11.tgz#ee3def1f27d9ed66dac6e46a295cffb0152e058d"
4138+
integrity sha512-cqefuRsh12pWyGsIoBKJA9luFu3mRxCA+ORZvA4ktLSzIuCUtWVxGIuXigEwO5/ywWFMZ2QEGKWvkZG1zDMTag==
4139+
4140+
"@tsconfig/node14@^1.0.0":
4141+
version "1.0.3"
4142+
resolved "https://registry.yarnpkg.com/@tsconfig/node14/-/node14-1.0.3.tgz#e4386316284f00b98435bf40f72f75a09dabf6c1"
4143+
integrity sha512-ysT8mhdixWK6Hw3i1V2AeRqZ5WfXg1G43mqoYlM2nc6388Fq5jcXyr5mRsqViLx/GJYdoL0bfXD8nmF+Zn/Iow==
4144+
4145+
"@tsconfig/node16@^1.0.2":
4146+
version "1.0.4"
4147+
resolved "https://registry.yarnpkg.com/@tsconfig/node16/-/node16-1.0.4.tgz#0b92dcc0cc1c81f6f306a381f28e31b1a56536e9"
4148+
integrity sha512-vxhUy4J8lyeyinH7Azl1pdd43GJhZH/tP2weN8TntQblOY+A0XbT8DJk1/oCPuOOyg/Ja757rG0CgHcWC8OfMA==
4149+
41154150
"@tufjs/[email protected]":
41164151
version "1.0.0"
41174152
resolved "https://registry.yarnpkg.com/@tufjs/canonical-json/-/canonical-json-1.0.0.tgz#eade9fd1f537993bc1f0949f3aea276ecc4fab31"
@@ -5200,7 +5235,7 @@ acorn-walk@^7.1.1:
52005235
version "7.2.0"
52015236
resolved "https://registry.npmjs.org/acorn-walk/-/acorn-walk-7.2.0.tgz"
52025237

5203-
acorn-walk@^8.0.0:
5238+
acorn-walk@^8.0.0, acorn-walk@^8.1.1:
52045239
version "8.2.0"
52055240
resolved "https://registry.yarnpkg.com/acorn-walk/-/acorn-walk-8.2.0.tgz#741210f2e2426454508853a2f44d0ab83b7f69c1"
52065241
integrity sha512-k+iyHEuPgSw6SbuDpGQM+06HQUa04DZ3o+F6CSzXMvvI5KMvnaEqXe+YVe555R9nn6GPt404fos4wcgpw12SDA==
@@ -5496,6 +5531,11 @@ are-we-there-yet@^3.0.0:
54965531
delegates "^1.0.0"
54975532
readable-stream "^3.6.0"
54985533

5534+
arg@^4.1.0:
5535+
version "4.1.3"
5536+
resolved "https://registry.yarnpkg.com/arg/-/arg-4.1.3.tgz#269fc7ad5b8e42cb63c896d5666017261c144089"
5537+
integrity sha512-58S9QDqG0Xx27YwPSt9fJxivjYl432YCwfDMfZ+71RAqUrZef7LrKQZ3LHLOwCS4FLNBplP533Zx895SeOCHvA==
5538+
54995539
argparse@^1.0.7:
55005540
version "1.0.10"
55015541
resolved "https://registry.npmjs.org/argparse/-/argparse-1.0.10.tgz"
@@ -7687,6 +7727,11 @@ create-hmac@^1.1.0, create-hmac@^1.1.4, create-hmac@^1.1.7:
76877727
safe-buffer "^5.0.1"
76887728
sha.js "^2.4.8"
76897729

7730+
create-require@^1.1.0:
7731+
version "1.1.1"
7732+
resolved "https://registry.yarnpkg.com/create-require/-/create-require-1.1.1.tgz#c1d7e8f1e5f6cfc9ff65f9cd352d37348756c333"
7733+
integrity sha512-dcKFX3jn0MpIaXjisoRvexIJVEKzaq7z2rZKxf+MSr9TkdmHmsU4m2lcLojrj/FHl8mk5VxMmYA+ftRkP/3oKQ==
7734+
76907735
[email protected]:
76917736
version "3.1.5"
76927737
resolved "https://registry.yarnpkg.com/cross-fetch/-/cross-fetch-3.1.5.tgz#e1389f44d9e7ba767907f7af8454787952ab534f"
@@ -8325,6 +8370,11 @@ diff-sequences@^29.6.3:
83258370
resolved "https://registry.yarnpkg.com/diff-sequences/-/diff-sequences-29.6.3.tgz#4deaf894d11407c51efc8418012f9e70b84ea921"
83268371
integrity sha512-EjePK1srD3P08o2j4f0ExnylqRs5B9tJjcp9t1krH2qRi8CCdsYfwe9JgSLurFBWwq4uOlipzfk5fHNvwFKr8Q==
83278372

8373+
diff@^4.0.1:
8374+
version "4.0.2"
8375+
resolved "https://registry.yarnpkg.com/diff/-/diff-4.0.2.tgz#60f3aecb89d5fae520c11aa19efc2bb982aade7d"
8376+
integrity sha512-58lmxKSA4BNyLz+HHMUzlOEpg09FV+ev6ZMe3vJihgdxzgcwZ8VoEEPmALCZG9LmqfVoNMMKpttIYTVG6uDY7A==
8377+
83288378
diffie-hellman@^5.0.0:
83298379
version "5.0.3"
83308380
resolved "https://registry.npmjs.org/diffie-hellman/-/diffie-hellman-5.0.3.tgz"
@@ -13589,6 +13639,11 @@ make-dir@^2.0.0, make-dir@^2.1.0:
1358913639
pify "^4.0.1"
1359013640
semver "^5.6.0"
1359113641

13642+
make-error@^1.1.1:
13643+
version "1.3.6"
13644+
resolved "https://registry.yarnpkg.com/make-error/-/make-error-1.3.6.tgz#2eb2e37ea9b67c4891f684a1394799af484cf7a2"
13645+
integrity sha512-s8UhlNe7vPKomQhC1qFelMokr/Sc3AgNbso3n74mVPA5LTZwkB9NlXf4XPamLxJE8h0gh73rM94xvwRT2CVInw==
13646+
1359213647
make-fetch-happen@^10.0.3:
1359313648
version "10.2.1"
1359413649
resolved "https://registry.yarnpkg.com/make-fetch-happen/-/make-fetch-happen-10.2.1.tgz#f5e3835c5e9817b617f2770870d9492d28678164"
@@ -18678,6 +18733,25 @@ ts-loader@^8.3.0:
1867818733
micromatch "^4.0.0"
1867918734
semver "^7.3.4"
1868018735

18736+
ts-node@^10.9.1:
18737+
version "10.9.1"
18738+
resolved "https://registry.yarnpkg.com/ts-node/-/ts-node-10.9.1.tgz#e73de9102958af9e1f0b168a6ff320e25adcff4b"
18739+
integrity sha512-NtVysVPkxxrwFGUUxGYhfux8k78pQB3JqYBXlLRZgdGUqTO5wU/UyHop5p70iEbGhB7q5KmiZiU0Y3KlJrScEw==
18740+
dependencies:
18741+
"@cspotcode/source-map-support" "^0.8.0"
18742+
"@tsconfig/node10" "^1.0.7"
18743+
"@tsconfig/node12" "^1.0.7"
18744+
"@tsconfig/node14" "^1.0.0"
18745+
"@tsconfig/node16" "^1.0.2"
18746+
acorn "^8.4.1"
18747+
acorn-walk "^8.1.1"
18748+
arg "^4.1.0"
18749+
create-require "^1.1.0"
18750+
diff "^4.0.1"
18751+
make-error "^1.1.1"
18752+
v8-compile-cache-lib "^3.0.1"
18753+
yn "3.1.1"
18754+
1868118755
ts-patch@^2.1.0:
1868218756
version "2.1.0"
1868318757
resolved "https://registry.yarnpkg.com/ts-patch/-/ts-patch-2.1.0.tgz#b4ba3e3f029144d7c4c6566916ebd5a453f070f5"
@@ -19318,6 +19392,11 @@ uuid@^9.0.0:
1931819392
resolved "https://registry.yarnpkg.com/uuid/-/uuid-9.0.0.tgz#592f550650024a38ceb0c562f2f6aa435761efb5"
1931919393
integrity sha512-MXcSTerfPa4uqyzStbRoTgt5XIe3x5+42+q1sDuy3R5MDk66URdLMOZe5aPX/SQd+kuYAh0FdP/pO28IkQyTeg==
1932019394

19395+
v8-compile-cache-lib@^3.0.1:
19396+
version "3.0.1"
19397+
resolved "https://registry.yarnpkg.com/v8-compile-cache-lib/-/v8-compile-cache-lib-3.0.1.tgz#6336e8d71965cb3d35a1bbb7868445a7c05264bf"
19398+
integrity sha512-wa7YjyUGfNZngI/vtK0UHAN+lgDCxBPCylVXGp0zu59Fz5aiGtNXaq3DhIov063MorB+VfufLh3JlF2KdTK3xg==
19399+
1932119400
[email protected]:
1932219401
version "2.3.0"
1932319402
resolved "https://registry.yarnpkg.com/v8-compile-cache/-/v8-compile-cache-2.3.0.tgz#2de19618c66dc247dcfb6f99338035d8245a2cee"
@@ -20404,6 +20483,11 @@ ylru@^1.2.0:
2040420483
version "1.2.1"
2040520484
resolved "https://registry.npmjs.org/ylru/-/ylru-1.2.1.tgz"
2040620485

20486+
[email protected]:
20487+
version "3.1.1"
20488+
resolved "https://registry.yarnpkg.com/yn/-/yn-3.1.1.tgz#1e87401a09d767c1d5eab26a6e4c185182d2eb50"
20489+
integrity sha512-Ux4ygGWsu2c7isFWe8Yu1YluJmqVhxqK2cLXNQA5AcC3QfbGNpM7fu0Y8b/z16pXLnFxZYvWhd3fhBY9DLmC6Q==
20490+
2040720491
yocto-queue@^0.1.0:
2040820492
version "0.1.0"
2040920493
resolved "https://registry.yarnpkg.com/yocto-queue/-/yocto-queue-0.1.0.tgz#0294eb3dee05028d31ee1a5fa2c556a6aaf10a1b"

0 commit comments

Comments
 (0)