Rework bundler and bring back support to es2017 #1370

belgattitude · 2022-09-03T12:10:54Z

Purpose

Rework the bundler config to ensure emitted file are valid es2017 files. Will fix #1362

PS: merged as part of #1408

Approach

Tried to keep on rollup, but easily extensible for esbuild

How to try it out

cd ./packages/rooks
yarn build
yarn check:dist
yarn check:size

Checks

Impact on size: negligible imo

Tasks

Emit es2017 thx typescript (could work with esbuild too)
Add module export that might help some bundlers (no changes)
Removed unused files (ie: jest.setup.ts, test files)
Removed declaration maps for dist (they are only useful in monorepo ?)
Removed dual types publishing (kept ./types/index.d.ts, removed per-file declarations)
Didn't understand what was the purpose of index.standalone, need to clear this
Merge rollup configs, and allow to build umd as well - To test it out
Post-cleanup: remove obsoleted deps...

codesandbox · 2022-09-03T12:10:56Z

Open in CodeSandbox Web Editor | VS Code | VS Code Insiders

vercel · 2022-09-03T12:10:59Z

@belgattitude is attempting to deploy a commit to the Rooks Team on Vercel.

A member of the Team first needs to authorize it.

codecov · 2022-09-03T12:14:42Z

Codecov Report

Merging #1370 (8e0a59e) into main (c186858) will not change coverage.
The diff coverage is n/a.

@@           Coverage Diff           @@
##             main    #1370   +/-   ##
=======================================
  Coverage   91.61%   91.61%           
=======================================
  Files          76       76           
  Lines        4792     4792           
  Branches      816      816           
=======================================
  Hits         4390     4390           
  Misses        402      402

Help us with your feedback. Take ten seconds to tell us how you rate us. Have a feature suggestion? Share it here.

belgattitude · 2022-09-03T12:20:58Z

packages/rooks/package.json

+  "exports": {
+    ".": {
+      "types": "./dist/types/index.d.js",
+      "module": "./dist/esm/index.js",


Kept the module for webpack support (it's not part of the final spec). Not sure if recent versions needs that.

Didn't add the browser field (umd), cause nextjs 12.x will pick it up and defeat tree-shakability (browser bundle should be one file for now)

@belgattitude Could you help me with any reading material for me to fully understand what has changed in the exports field? It changes so often I lost track of it. For eg, what does what field within exports do and what everyone else does, etc. Just want to make sure I understand all the changes we are making and we don't accidentally break anything.

Most up-to-date I found out is

https://github.com/frehner/modern-guide-to-packaging-js-library#define-your-exports

If you feel unsure I can cherry-pick this and create another PR.

@belgattitude Thanks for this! I will read this and get back. I will take a good look at this PR tomorrow.

TIL learnt a lot from that link today. Thanks!

packages/rooks/rollup.config.ts

belgattitude · 2022-09-03T12:23:30Z

packages/rooks/rollup.future.config.ts

+
+const tsPathPlugin = typescriptPaths({
+  preserveExtensions: true,
+  tsConfigPath: "./tsconfig.json",


typescriptPaths plugin does not support extend from tsconfig.build.json. So I use the paths from there. Note that it makes use remove composite: true.

belgattitude · 2022-09-03T12:26:58Z

Hey @imbhargav5. It's just a start.

But I'd like to know

What's the purpose of publishing index.standalone.js ? Is it important ?
Are the declaration sourcempas and sourcemaps important ?

I'm not totally sure about this.

Happy week-end.

packages/rooks/tsconfig.json

imbhargav5 · 2022-09-04T04:39:24Z

Going to look at this tonight!

imbhargav5 · 2022-09-04T06:23:28Z

@belgattitude index.standalone is an artefact from a year ago and we don't need that anymore. Thanks for pointing that out. We can remove it. 😄

vercel · 2022-09-04T06:23:46Z

The latest updates on your projects. Learn more about Vercel for Git ↗︎

Name	Status	Preview	Updated
rooks	✅ Ready (Inspect)	Visit Preview	Sep 10, 2022 at 11:18AM (UTC)

belgattitude · 2022-09-06T08:11:16Z

@imbhargav5

If all looks good to you, my plan is to replace the build with build-future and the new rollup config. I'll undraft when done.

My last concern, I saw a drop in size in the umd bundle. I guess is that the *.spec.ts aren't treated anymore. But I'd like another look.

imbhargav5 · 2022-09-06T11:47:53Z

Will take a look.

imbhargav5 · 2022-09-06T17:34:03Z

@belgattitude Looks like a great start. I am getting errors after I run yarn run build:future && yarn run check:dist. Is that expected?

belgattitude · 2022-09-06T18:35:26Z

Yes it will check the ./dist/* folder, not the ./dist/future 😄 . I'll P/R tomorrow.

belgattitude · 2022-09-07T10:04:14Z

Hey @imbhargav5 I've just finalized the thing.

Added

a (patch) changeset
a probably useful 'typecheck' step (no on CI though), that can pave the way for using esbuild.

Entered pre canary mode, so If you don't mind I'd like to test a canary version release first.

# Conflicts: # packages/rooks/package.json # yarn.lock

belgattitude · 2022-09-08T16:46:54Z

Found a little time and fixed conflicts.

Ported the check-size in #1365

Good news, the size increase is very minimal

The build passed from 20s to 15s on my laptop. Imo it can be merged, let me know if you have questions.

Thanks for this beautiful lib

belgattitude · 2022-09-08T16:49:35Z

packages/rooks/.size-limit.js

+// @ts-check
+
+// Regularly update this max size when new hooks are added (keep a threshold)
+const fullBundleMaxSize = "12KB";


@imbhargav5 just to mention, if enforced on CI and new hooks are added and the total size of lib grow, this should be increased.

On the other side, it's totally possible to keep only the "ESM Webpack ({ useDebounce })" (see below), that's actually the important check

@belgattitude Ah. I think we could write a small script to autopopulate new hooks into the size-limit file when new hooks are added and keep the limit at 2kb. What do you think?

imbhargav5 · 2022-09-11T05:29:43Z

packages/rooks/package.json

@@ -7,6 +7,15 @@
  "unpkg": "dist/umd/rooks.umd.js",
  "types": "dist/types/index.d.ts",
  "typings": "dist/types/index.d.ts",
+  "exports": {
+    ".": {
+      "types": "./dist/types/index.d.js",


Suggested change

"types": "./dist/types/index.d.js",

"types": "./dist/types/index.d.ts",

imbhargav5 · 2022-09-11T05:34:35Z

This is such a massive improvement @belgattitude ! I just want to keep this in pre mode for a bit for a couple of days. Can we re-enter pre mode again? Once the conflicts are merged and my code suggestion resolved, I will get this shipped today. 🙌

imbhargav5 · 2022-09-11T05:43:09Z

@belgattitude I continued your work here. #1408

belgattitude added 7 commits September 3, 2022 14:01

feat: add export field for esm and cjs

3ae953d

fix: remove babel warning about default

262f5ab

chore(dev-dep): add rollup-plugin-typescript-path

d86fe5c

chore: add specific tsconfig build config

fac1ae9

chore: remove composite field (no project references)

4e385d6

chore: prepare test for new rollup config

501b0e6

chore(script): add build-future for new bundling

9083b1d

belgattitude commented Sep 3, 2022

View reviewed changes

packages/rooks/rollup.config.ts Show resolved Hide resolved

belgattitude commented Sep 3, 2022

View reviewed changes

packages/rooks/tsconfig.json Show resolved Hide resolved

belgattitude added 2 commits September 3, 2022 14:46

feat: add umd build, fix esm export

e805e1c

chore: add check dist for es2017

7ec033c

vercel bot deployed to Preview September 4, 2022 06:26 View deployment

imbhargav5 marked this pull request as ready for review September 7, 2022 03:52

belgattitude added 4 commits September 7, 2022 11:48

refactor: replace old rollup by new one

1861238

chore: add typecheck

236ca45

refactor: move to new build system

fa383ce

chore(scripts): add typecheck

e580278

belgattitude added 2 commits September 7, 2022 11:53

chore: final dist directory

b9285fe

chore: changesets and enable canary

c3a6686

belgattitude mentioned this pull request Sep 7, 2022

check:dist based on es-check (do not merge) #1366

Closed

chore(dev-deps): remove unused deps

35c8b66

vercel bot deployed to Preview September 8, 2022 06:23 View deployment

belgattitude added 3 commits September 8, 2022 16:36

Merge branch 'main' into refactor-bundling-es2017

f974613

chore(size-limit): improve track tree-shaked size

c87517d

chore(dev-deps): remove unused dep

0349c28

belgattitude mentioned this pull request Sep 8, 2022

chore: add check-size script #1365

Closed

belgattitude added 3 commits September 8, 2022 18:41

Merge branch 'main' into refactor-bundling-es2017

a736764

# Conflicts: # packages/rooks/package.json # yarn.lock

chore(lock): freshen

f27e25a

chore(size-limit): clarify intent

e71bee8

belgattitude commented Sep 8, 2022

View reviewed changes

chore: exit pre

8e0a59e

belgattitude mentioned this pull request Sep 8, 2022

[useTimeTravelState] Fix: remove default export #1393

Merged

vercel bot deployed to Preview September 10, 2022 11:18 View deployment

imbhargav5 reviewed Sep 11, 2022

View reviewed changes

imbhargav5 closed this Sep 11, 2022

imbhargav5 mentioned this pull request Sep 11, 2022

Refactor bundling es2017 #1408

Merged

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

Rework bundler and bring back support to es2017 #1370

Rework bundler and bring back support to es2017 #1370

belgattitude commented Sep 3, 2022 •

edited

Loading

codesandbox bot commented Sep 3, 2022

vercel bot commented Sep 3, 2022

codecov bot commented Sep 3, 2022 •

edited

Loading

belgattitude Sep 3, 2022 •

edited

Loading

imbhargav5 Sep 4, 2022 •

edited

Loading

belgattitude Sep 6, 2022

belgattitude Sep 6, 2022

imbhargav5 Sep 6, 2022

imbhargav5 Sep 6, 2022

belgattitude Sep 3, 2022

belgattitude commented Sep 3, 2022

imbhargav5 commented Sep 4, 2022

imbhargav5 commented Sep 4, 2022

vercel bot commented Sep 4, 2022 •

edited

Loading

belgattitude commented Sep 6, 2022

imbhargav5 commented Sep 6, 2022

imbhargav5 commented Sep 6, 2022

belgattitude commented Sep 6, 2022

belgattitude commented Sep 7, 2022

belgattitude commented Sep 8, 2022

belgattitude Sep 8, 2022 •

edited

Loading

imbhargav5 Sep 11, 2022

belgattitude Sep 11, 2022

imbhargav5 Sep 11, 2022

imbhargav5 commented Sep 11, 2022 •

edited

Loading

imbhargav5 commented Sep 11, 2022

	"types": "./dist/types/index.d.js",
	"types": "./dist/types/index.d.ts",

Rework bundler and bring back support to es2017 #1370

Rework bundler and bring back support to es2017 #1370

Conversation

belgattitude commented Sep 3, 2022 • edited Loading

Purpose

Approach

How to try it out

Checks

Tasks

codesandbox bot commented Sep 3, 2022

vercel bot commented Sep 3, 2022

codecov bot commented Sep 3, 2022 • edited Loading

Codecov Report

belgattitude Sep 3, 2022 • edited Loading

Choose a reason for hiding this comment

imbhargav5 Sep 4, 2022 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

belgattitude commented Sep 3, 2022

imbhargav5 commented Sep 4, 2022

imbhargav5 commented Sep 4, 2022

vercel bot commented Sep 4, 2022 • edited Loading

belgattitude commented Sep 6, 2022

imbhargav5 commented Sep 6, 2022

imbhargav5 commented Sep 6, 2022

belgattitude commented Sep 6, 2022

belgattitude commented Sep 7, 2022

belgattitude commented Sep 8, 2022

belgattitude Sep 8, 2022 • edited Loading

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

Choose a reason for hiding this comment

imbhargav5 commented Sep 11, 2022 • edited Loading

imbhargav5 commented Sep 11, 2022

belgattitude commented Sep 3, 2022 •

edited

Loading

codecov bot commented Sep 3, 2022 •

edited

Loading

belgattitude Sep 3, 2022 •

edited

Loading

imbhargav5 Sep 4, 2022 •

edited

Loading

vercel bot commented Sep 4, 2022 •

edited

Loading

belgattitude Sep 8, 2022 •

edited

Loading

imbhargav5 commented Sep 11, 2022 •

edited

Loading