-
deployed to https://kujawa.netlify.app/, running the stand-alone version.
-
executable via
- stand-alone:
npm start
&npm run build
- micro frontend:
npm run start:mfe
&npm run build:mfe
- stand-alone:
- readd image somwhere (
import ImageDogeUrl from "../assets/doge.jpg";
)
- bundling, linting, formatting (webpack, ESLint, Prettier)
- transpiling incl. sourcemaps, TS definition files, and browser support (webpack, TSC, Babel)
- client-side routing (react-router, webpack)
- code-split & prefetched pages (react-router, webpack)
- prefetched pages' data (react-query)
- client network cache (react-query)
- React Concurrent Rendering (useDefferedValue, but no useTransition)
- suspense-enabled data-fetching (React Experimental!, react-query)
- UI development incl. infinite scrolling (mui)
- in order to receive type interference for imported modules, ESM is needed.
So in TS I set
"esModuleInterop": true
and import CJS like ESM, e.g.import express from "express"
. - but when transpiling to NodeJs, what expects CommonJS by default, one faces two options
- transpile to CommonJS via TSC, by effectively just staying with all defaults
- transpile to ESM via TSC and inform NodeJs, by
- in
package.json
, settype: module
and use.cjs
for overrides - add
.js
to all ES imports (use it even for TS files) - in tsconfig set
"module": "NodeNext"
- transpile not via
ts-node
(TypeStrong/ts-node#1007), but eithertsc-watch
or both plaintsc
andnode
and since TSC can only accept a tsconfig OR entry file, setoutDir
in tsconfig
- in
- besides
- JSON needs to be imported suffixed with
assert { type: "json" };
- globals like
__dirname
do not exist anymore
- JSON needs to be imported suffixed with