From 8105974b4785ce61eac919ae1efef3cab5f40a82 Mon Sep 17 00:00:00 2001 From: juniorxsound Date: Tue, 15 Mar 2022 16:19:04 -0400 Subject: [PATCH] Change ESM builds for R3F so the components are treeshakeable --- packages/r3f/devEnv/build.ts | 9 ++++- packages/r3f/package.json | 5 ++- packages/r3f/tsconfig.json | 2 +- yarn.lock | 74 ++++++++++++++++++++++++++++++++++++ 4 files changed, 86 insertions(+), 4 deletions(-) diff --git a/packages/r3f/devEnv/build.ts b/packages/r3f/devEnv/build.ts index fb429cfe7..74327b540 100644 --- a/packages/r3f/devEnv/build.ts +++ b/packages/r3f/devEnv/build.ts @@ -2,6 +2,7 @@ import * as path from 'path' import {build} from 'esbuild' import type {Plugin} from 'esbuild' import {existsSync, mkdirSync, writeFileSync} from 'fs' +import {globPlugin} from 'esbuild-plugin-glob' const externalPlugin = (patterns: RegExp[]): Plugin => { return { @@ -67,10 +68,16 @@ function createBundles(watch: boolean) { {encoding: 'utf-8'}, ) + if (!existsSync(path.join(pathToPackage, 'dist/esm'))) + mkdirSync(path.join(pathToPackage, 'dist/esm')) + build({ ...esbuildConfig, - outfile: path.join(pathToPackage, 'dist/index.mjs'), + entryPoints: ['src/**/**/*.ts', 'src/**/**/*.tsx'], + outdir: path.join(pathToPackage, 'dist/esm'), format: 'esm', + bundle: false, + plugins: [globPlugin()], }) } diff --git a/packages/r3f/package.json b/packages/r3f/package.json index dd3a35d84..e050c416d 100644 --- a/packages/r3f/package.json +++ b/packages/r3f/package.json @@ -20,8 +20,8 @@ "directory": "packages/r3f" }, "main": "dist/index.js", - "module": "dist/index.mjs", - "types": "dist/index.d.ts", + "module": "dist/esm/index.js", + "types": "dist/esm/index.d.ts", "sideEffects": false, "files": [ "dist/**/*" @@ -40,6 +40,7 @@ "@types/node": "^15.6.2", "@types/react": "^17.0.9", "@types/styled-components": "^5.1.9", + "esbuild-plugin-glob": "^1.1.1", "npm-run-all": "^4.1.5", "typescript": "^4.4.2" }, diff --git a/packages/r3f/tsconfig.json b/packages/r3f/tsconfig.json index 3c426070e..bee30d972 100644 --- a/packages/r3f/tsconfig.json +++ b/packages/r3f/tsconfig.json @@ -1,7 +1,7 @@ { "extends": "../../tsconfig.base.json", "compilerOptions": { - "outDir": "dist", + "outDir": "dist/esm", "lib": ["ESNext", "DOM"], "rootDir": "src", "types": ["jest", "node"], diff --git a/yarn.lock b/yarn.lock index 64801e3b5..49dfd887a 100644 --- a/yarn.lock +++ b/yarn.lock @@ -5222,6 +5222,7 @@ __metadata: "@types/node": ^15.6.2 "@types/react": ^17.0.9 "@types/styled-components": ^5.1.9 + esbuild-plugin-glob: ^1.1.1 lodash-es: ^4.17.21 npm-run-all: ^4.1.5 polished: ^4.1.3 @@ -8335,6 +8336,25 @@ __metadata: languageName: node linkType: hard +"chokidar@npm:^3.5.3": + version: 3.5.3 + resolution: "chokidar@npm:3.5.3" + dependencies: + anymatch: ~3.1.2 + braces: ~3.0.2 + fsevents: ~2.3.2 + glob-parent: ~5.1.2 + is-binary-path: ~2.1.0 + is-glob: ~4.0.1 + normalize-path: ~3.0.0 + readdirp: ~3.6.0 + dependenciesMeta: + fsevents: + optional: true + checksum: b49fcde40176ba007ff361b198a2d35df60d9bb2a5aab228279eb810feae9294a6b4649ab15981304447afe1e6ffbf4788ad5db77235dc770ab777c6e771980c + languageName: node + linkType: hard + "chownr@npm:^1.1.1": version: 1.1.4 resolution: "chownr@npm:1.1.4" @@ -10555,6 +10575,20 @@ __metadata: languageName: node linkType: hard +"esbuild-plugin-glob@npm:^1.1.1": + version: 1.1.1 + resolution: "esbuild-plugin-glob@npm:1.1.1" + dependencies: + chokidar: ^3.5.3 + minimatch: ^3.1.0 + tiny-glob: ^0.2.9 + tiny-invariant: ^1.2.0 + peerDependencies: + esbuild: ^0.x.x + checksum: 4025e7ff7c543308086d7831fc286aeb50ab59617b5c47f0da3e0490f17554e1a1a8e909986f795d455c64eeceab2739c5d457d02e592c82479dd7648f83a22d + languageName: node + linkType: hard + "esbuild-register@npm:^2.5.0": version: 2.5.0 resolution: "esbuild-register@npm:2.5.0" @@ -12277,6 +12311,13 @@ fsevents@^1.2.7: languageName: node linkType: hard +"globalyzer@npm:0.1.0": + version: 0.1.0 + resolution: "globalyzer@npm:0.1.0" + checksum: 419a0f95ba542534fac0842964d31b3dc2936a479b2b1a8a62bad7e8b61054faa9b0a06ad9f2e12593396b9b2621cac93358d9b3071d33723fb1778608d358a1 + languageName: node + linkType: hard + "globby@npm:11.0.1": version: 11.0.1 resolution: "globby@npm:11.0.1" @@ -12332,6 +12373,13 @@ fsevents@^1.2.7: languageName: node linkType: hard +"globrex@npm:^0.1.2": + version: 0.1.2 + resolution: "globrex@npm:0.1.2" + checksum: adca162494a176ce9ecf4dd232f7b802956bb1966b37f60c15e49d2e7d961b66c60826366dc2649093cad5a0d69970cfa8875bd1695b5a1a2f33dcd2aa88da3c + languageName: node + linkType: hard + "glsl-noise@npm:^0.0.0": version: 0.0.0 resolution: "glsl-noise@npm:0.0.0" @@ -16194,6 +16242,15 @@ fsevents@^1.2.7: languageName: node linkType: hard +"minimatch@npm:^3.1.0": + version: 3.1.2 + resolution: "minimatch@npm:3.1.2" + dependencies: + brace-expansion: ^1.1.7 + checksum: c154e566406683e7bcb746e000b84d74465b3a832c45d59912b9b55cd50dee66e5c4b1e5566dba26154040e51672f9aa450a9aef0c97cfc7336b78b7afb9540a + languageName: node + linkType: hard + "minimist@npm:^1.1.1, minimist@npm:^1.1.3, minimist@npm:^1.2.0, minimist@npm:^1.2.5": version: 1.2.5 resolution: "minimist@npm:1.2.5" @@ -22308,6 +22365,16 @@ fsevents@^1.2.7: languageName: node linkType: hard +"tiny-glob@npm:^0.2.9": + version: 0.2.9 + resolution: "tiny-glob@npm:0.2.9" + dependencies: + globalyzer: 0.1.0 + globrex: ^0.1.2 + checksum: aea5801eb6663ddf77ebb74900b8f8bd9dfcfc9b6a1cc8018cb7421590c00bf446109ff45e4b64a98e6c95ddb1255a337a5d488fb6311930e2a95334151ec9c6 + languageName: node + linkType: hard + "tiny-inflate@npm:^1.0.0, tiny-inflate@npm:^1.0.3": version: 1.0.3 resolution: "tiny-inflate@npm:1.0.3" @@ -22315,6 +22382,13 @@ fsevents@^1.2.7: languageName: node linkType: hard +"tiny-invariant@npm:^1.2.0": + version: 1.2.0 + resolution: "tiny-invariant@npm:1.2.0" + checksum: e09a718a7c4a499ba592cdac61f015d87427a0867ca07f50c11fd9b623f90cdba18937b515d4a5e4f43dac92370498d7bdaee0d0e7a377a61095e02c4a92eade + languageName: node + linkType: hard + "tmpl@npm:1.0.x": version: 1.0.4 resolution: "tmpl@npm:1.0.4"