From fa03e1a3d03f9c6258cf1b7f613d6297ff8dd027 Mon Sep 17 00:00:00 2001 From: Pedro Cattori Date: Thu, 29 Jun 2023 15:02:43 -0400 Subject: [PATCH] fix(dev): ignore missing react-dom/client for react 17 --- .changeset/famous-games-film.md | 5 ++ notes/TODO.md | 58 ++++++++++++++++++ notes/compiler-todos.md | 8 +++ notes/devcli.md | 61 +++++++++++++++++++ notes/new-todo.md | 33 ++++++++++ notes/tux-notes.md | 56 +++++++++++++++++ .../remix-dev/config/defaults/entry.dev.ts | 2 +- 7 files changed, 222 insertions(+), 1 deletion(-) create mode 100644 .changeset/famous-games-film.md create mode 100644 notes/TODO.md create mode 100644 notes/compiler-todos.md create mode 100644 notes/devcli.md create mode 100644 notes/new-todo.md create mode 100644 notes/tux-notes.md diff --git a/.changeset/famous-games-film.md b/.changeset/famous-games-film.md new file mode 100644 index 00000000000..2cfe70daf40 --- /dev/null +++ b/.changeset/famous-games-film.md @@ -0,0 +1,5 @@ +--- +"@remix-run/dev": patch +--- + +ignore missing react-dom/client for react 17 diff --git a/notes/TODO.md b/notes/TODO.md new file mode 100644 index 00000000000..31ade5351fd --- /dev/null +++ b/notes/TODO.md @@ -0,0 +1,58 @@ +# dev server + +- can esbuild get interrupted from writing files? +- what if some builds succeed and others fail? + + - need to clear out old files... + +- [ ] delete old assets (by mtime) when new build finishes? + +# unstable_dev + +- https://github.com/remix-run/remix/issues/5711 +- https://github.com/remix-run/remix/issues/5663 +- https://github.com/remix-run/remix/issues/5642 +- https://github.com/remix-run/remix/issues/5492 + +## needs repro or docs + +- https://github.com/remix-run/remix/issues/5626 +- https://github.com/remix-run/remix/issues/5517 + +# perf + +- https://github.com/remix-run/remix/issues/5629 + +--- + +# node builtins + +- esbuild plugin for bare modules +- if not a dep and a built in: + - set side-effects to false + - set resolve to some sentinel that is easily grep'able thing + - throw some exception that is nicer for browser + - search `public/build/` dir for that sentinel, and error if we find it + - ^can we do this just for node? + +# TODO + +- [ ] better types + + - https://github.com/remix-run/remix/issues/3931 + - https://github.com/remix-run/remix/issues/5211 + - https://github.com/remix-run/remix/issues/4371 + +- [ ] MDX? + +## quick wins + +- [ ] repro live reload https://github.com/remix-run/remix/issues/3237 +- [ ] filter out `node:{builtin}` from browser https://github.com/remix-run/remix/discussions/4544 + +## follow up + +- [ ] investigate leaky stdio from integration tests. can we use `captureError` or `cli.shouldError`? +- [ ] refactor tests to use new, optimized cli utils +- [ ] don't overwrite tsconfig when readConfig is called. + - [ ] Instead, maybe overwrite tsconfig whenever any commands are called diff --git a/notes/compiler-todos.md b/notes/compiler-todos.md new file mode 100644 index 00000000000..7632baa1e09 --- /dev/null +++ b/notes/compiler-todos.md @@ -0,0 +1,8 @@ +# TODO + +- [ ] remove `metafile` from css compiler config +- [ ] consider making subcompilers into just configs + +- [ ] `remix watch` should _not_ live reload +- [ ] clean up subcompiler configs +- [ ] MEASURE esbuild incremental vs initial for Remix projects. might not be that different diff --git a/notes/devcli.md b/notes/devcli.md new file mode 100644 index 00000000000..4034ba8076c --- /dev/null +++ b/notes/devcli.md @@ -0,0 +1,61 @@ +# UI +- `clear` screen +- newlines before and after initial +- show `Remix`, version, ready time, network +- capture shortcuts + - help + - app server + - dev server + +- show errors +- progress indication for rebuilds + +## Commands + +```sh +npx create-remix +remix build [--watch] # watch just watch for file changes and rebuilds +remix dev +``` + +## UI + +```sh + Remix v2.0.0 ready in 362 ms + + ➜ Local: http://127.0.0.1:3000 + ➜ Network: use --host to expose + ➜ press h to show help + +POST /products +POST /products +GET /products/1 + + 🔄 Rebuilding + - File changed: app/routes/products/$pid.tsx + - 🔥 Component changed 👉 HMR + - took 200ms + +GET /products/2 +GET /products/1 + + 🔄 Rebuilding + - File changed: app/routes/products/$pid.tsx + - 🔥 Component changed 👉 HMR + - 🔥 Loader changed 👉 HDR + - took 156ms + + 🔄 Rebuilding + - File changed: app/routes/products/$pid.tsx + 🟢 Built: assets/css + 🔴 Error: assets/js + File: apps/routes/routes/products/$pid.tsx:36 + + let price = prodct.price + ^^^^^^ + + Could not find variable `prodct` + + ⚪️ Canceled: server +``` + diff --git a/notes/new-todo.md b/notes/new-todo.md new file mode 100644 index 00000000000..74a9c2f163f --- /dev/null +++ b/notes/new-todo.md @@ -0,0 +1,33 @@ +# PR 1: cleanup + +- [x] remove `CliError` +- [x] remove `logging` module +- [ ] inline `target` for server build + +# PR 2 + +--- + +- [ ] each esbuild error/warning on its own logline + + - [ ] cancelations: log cancel, ignore, log other warnings/errors? + - [ ] strip `x [ERROR]` preamble + - [ ] dedup esbuild warnings/errors + +- [ ] `future` warnings +- [ ] hints for warnings and errors? +- [ ] factor out "missing import" warning logic + +# build + +- [x] logger replaces console.x +- [ ] error stack styling +- [ ] warn/error hints? + +# watch + +- [ ] old/new dev server + +# follow-up + +concise warnings and errors with links to more info diff --git a/notes/tux-notes.md b/notes/tux-notes.md new file mode 100644 index 00000000000..9c08ecdd1fc --- /dev/null +++ b/notes/tux-notes.md @@ -0,0 +1,56 @@ +- [ ] https://github.com/terkelg/sisteransi +- [ ] https://github.com/alexeyraspopov/picocolors +- [ ] raw mode for capturing input: https://github.com/vitejs/vite/blob/a2b7a51eb09acf794b3696e448eb4839ef80a3c9/packages/vite/src/node/shortcuts.ts#L75 +- [ ] https://nodejs.org/api/perf_hooks.html#performancenow +- [ ] https://www.npmjs.com/package/meow + +# build success + +``` +REMIX vX.Y.Z build for + +W: something is weird + +* Building... +V Built in 156ms +``` + +# dev + +``` +REMIX vX.Y.Z dev + + V assets/css + x assets/js + - ERROR: fileblah.js:34 + - server + + + V Rebuilt in 156ms [app/routes/hello.tsx] + V assets/css + V assets/js + V server + + [app] GET /home/products 56ms + > GET /home/products 56ms + + V Rebuilt in 84ms + + V Rebuilt in 156ms [3 routes changed] + - assets/css [skipped] + V assets/js (100ms) + V server (150ms) + + * Rebuilding... + - assets/css [skipped] + V assets/js (156ms) + * server + + * Rebuilding... + V Rebuilt in 156ms + + 1:49:24 PM [dev] hmr /src/App.tsx + 1:49:24 PM [dev] hdr /src/App.tsx + 1:49:24 PM [dev] hxr /src/App.tsx + 1:49:24 PM [app] GET /products/blah +``` diff --git a/packages/remix-dev/config/defaults/entry.dev.ts b/packages/remix-dev/config/defaults/entry.dev.ts index 036c6c04a9f..20d5e95db04 100644 --- a/packages/remix-dev/config/defaults/entry.dev.ts +++ b/packages/remix-dev/config/defaults/entry.dev.ts @@ -6,7 +6,7 @@ export default () => { import("react/jsx-dev-runtime"); import("react/jsx-runtime"); import("react-dom"); - import("react-dom/client"); + import("react-dom/client").catch(); import("react-refresh/runtime"); import("@remix-run/react"); import("remix:hmr");