From cf5d63dac9ebcebd4379714eb18636d6bad1daa2 Mon Sep 17 00:00:00 2001 From: Steven DeMartini Date: Tue, 20 Aug 2024 02:00:13 -0700 Subject: [PATCH 1/3] Add commonjs type in package.json to be explicit Per recommendation from publint. https://publint.dev/rules#use_type > The package does not specify the "type" field. NodeJS may attempt to detect the package type causing a small performance hit. Consider adding "type": "commonjs". --- package.json | 1 + 1 file changed, 1 insertion(+) diff --git a/package.json b/package.json index e41bdf0..5aa6f1d 100644 --- a/package.json +++ b/package.json @@ -21,6 +21,7 @@ "files": [ "dist" ], + "type": "commonjs", "types": "./dist/index.d.ts", "main": "dist/index.js", "module": "dist/esm/index.js", From 6ad0cfd5bf39318dcb79280c5a97b1e3f3130676 Mon Sep 17 00:00:00 2001 From: Steven DeMartini Date: Tue, 20 Aug 2024 02:05:23 -0700 Subject: [PATCH 2/3] Add arethetypeswrong to CI to validate packaging Following https://github.com/JoshuaKGoldberg/create-typescript-app/issues/1633#issuecomment-2291474994 --- .github/workflows/build-test.yml | 3 +++ 1 file changed, 3 insertions(+) diff --git a/.github/workflows/build-test.yml b/.github/workflows/build-test.yml index 718cab3..8ac2025 100644 --- a/.github/workflows/build-test.yml +++ b/.github/workflows/build-test.yml @@ -66,3 +66,6 @@ jobs: # Run the tests and print out the coverage information. In the future, # we could integrate with Codecov or something. run: pnpm run test:coverage + + - name: Validate the build's packaging CJS and ESM compatibility + run: npx @arethetypeswrong/cli@0.15.4 --pack From a49802acaad0b13196674dc9303c5d47a42b8004 Mon Sep 17 00:00:00 2001 From: Steven DeMartini Date: Tue, 20 Aug 2024 17:24:34 -0700 Subject: [PATCH 3/3] Force node to use CJS to get around dependency import errors Should resolve https://github.com/sjdemartini/mui-tiptap/issues/256. Both `@mui/icons-material` (https://github.com/mui/material-ui/issues/35233) and `lodash` (https://github.com/lodash/lodash/issues/5107) have problems being imported in a consuming package when using ESM. The workarounds attempted in https://github.com/sjdemartini/mui-tiptap/pull/258 almost seemed to work (didn't break a downstream bundled package using Vite), but still caused problems for the original example node application https://codesandbox.io/p/devbox/pensive-volhard-hyhtls, with errors like: ``` Error: Cannot find module '/path/to/mui-tiptap-in-node/node_modules/@mui/icons-material/esm/FormatColorFill ``` This approach is inspired by what tss-react does https://github.com/garronej/tss-react/blob/f5351e42e33f35f18415cfc1ffc6b08eb8ce4d25/package.json (e.g. see here https://github.com/garronej/tss-react/commit/46997026db70ec9bc326a1405d1ab7ea99a8d111 and https://github.com/garronej/tss-react/issues/164). With this change, this code now works in the node context (though slightly odd): ``` import pkg from "mui-tiptap"; const { FontSize, HeadingWithAnchor, ResizableImage, TableImproved } = pkg; ``` --- example/pnpm-lock.yaml | 2 +- package.json | 18 +++++++++--------- tsconfig.build.json | 5 ++++- 3 files changed, 14 insertions(+), 11 deletions(-) diff --git a/example/pnpm-lock.yaml b/example/pnpm-lock.yaml index 9f734bd..6a6bd28 100644 --- a/example/pnpm-lock.yaml +++ b/example/pnpm-lock.yaml @@ -2559,7 +2559,7 @@ packages: resolution: {directory: .., type: directory} id: file:.. name: mui-tiptap - version: 1.9.1 + version: 1.9.5 engines: {pnpm: '>=8'} requiresBuild: true peerDependencies: diff --git a/package.json b/package.json index 5aa6f1d..1f02555 100644 --- a/package.json +++ b/package.json @@ -22,25 +22,25 @@ "dist" ], "type": "commonjs", - "types": "./dist/index.d.ts", - "main": "dist/index.js", + "types": "./dist/cjs/index.d.ts", + "main": "dist/cjs/index.js", "module": "dist/esm/index.js", "exports": { ".": { - "types": "./dist/index.d.ts", - "require": "./dist/index.js", - "import": "./dist/esm/index.js" + "types": "./dist/cjs/index.d.ts", + "module": "./dist/esm/index.js", + "default": "./dist/cjs/index.js" }, "./icons": { - "types": "./dist/icons/index.d.ts", - "require": "./dist/icons/index.js", - "import": "./dist/esm/icons/index.js" + "types": "./dist/cjs/icons/index.d.ts", + "module": "./dist/esm/icons/index.js", + "default": "./dist/cjs/icons/index.js" } }, "typesVersions": { "*": { "icons": [ - "./dist/icons/index.d.ts" + "./dist/cjs/icons/index.d.ts" ], "*": [ "*" diff --git a/tsconfig.build.json b/tsconfig.build.json index 78c4f09..67a2e24 100644 --- a/tsconfig.build.json +++ b/tsconfig.build.json @@ -1,5 +1,8 @@ { "extends": "./tsconfig.json", "include": ["./src"], - "exclude": ["./src/demo", "./src/**/__tests__"] + "exclude": ["./src/demo", "./src/**/__tests__"], + "compilerOptions": { + "outDir": "./dist/cjs" + } }