usage notes - Githubissues

I've taken some excerpts from this and used it for my GitHub Pages deployment.

In order to integrate with my chosen dev/deployment tools, such as Typescript/tsx, pkgroll, and the NodeJS test runner, I've taken to slightly refactoring the scripts to use a more universal syntax (import x = require("x"), export = x) and have been paying close attention to variable scope and function purity.

It turns out to be quite tricky to get the cleanest possible output from transpiling Ts to Js; the main benefit seems rather that you can generate multiple different output targets (commonjs, ecma modules) in one run, from one source. Other than that, I'm surprised to find myself wondering if the benefits of writing in Typescript then transpiling to Js is less than simply writing the Js you need, with JSDocs for - broadly, - the same dev enhancements...

Currently, on the pages deployment, I'm moving the config/scripts files which make up one half of ts-esbuild-react/ts-esbuild-react-native-web into a root-level sub-directory, packages/@nathanjhood/esbuild-scripts. This will resemble a create-react-app that has not been fully ejected. If and when that works, I'll revisit this project and refactor it to closer resemble react-scripts, which itself is actually a sub-project of the create-react-app monorepo.

Once complete, the idea would be to replace the react-scripts npm package with this one (which I may even rename to esbuild-scripts). I might try to fit the React and React Native Web templates into an init script; but mostly, I'd like to get all of this NodeJS Typescript code moved away from the React App code, so that we the configs for Typescript, eslint/prettier, and all the rest, can be sufficiently de-coupled.

The plugin development branch may stall until needs must. I'll periodically revisit this ticket to submit PR's against, which reflect further usage notes as encountered on GitHub Pages deployment.

Until then, main is working surprisingly well. I invite any readers to clone and spin it up; the workflow runs indicate that things should be "just working" . Branch protections are in place to ensure what's offered in the README is maintained as a baseline.

So here is the main idea, currently, for the refactor. It requires the (always intended) transformation of both this and ts-esbuild-react into template projects, and the creation of a new root project to hold everything. It could look something like this:

- create-esbuild-app.git
  - / packages
    - / @nathanjhood 
      - / esbuild-scripts # a pkgroll-powered cli, defining the 'build', 'start', 'test', and 'init' commands
      - / ts-esbuild-react # a template project for a React (DOM) app
      - / ts-esbuild-react-native-web # a template project for a React Native Web project
      - / tsconfig(s) # recommended config(s) for Typescript
      - ...lint/format stuff?

Requirements:

finish the esbuild scripts to satisfaction and deploy them as a portable package over npm
take the same scripts stuff out of ts-esbuild-react/native-web to reduce those to simple React app templates
use the scripts package to continue developing my portfolio page

This was pretty much the idea from the beginning; or, it certainly would have been, if I'd have known everything I know now about how this all works. It's actually a good feeling in reflection, because I did at least know that I didn't know everything I'd need to know, but now I know that I was right to account for being wrong. ;)

nathanjhood / ts-esbuild-react-native-web

usage notes #32