TSDX User Guide
Congrats! You just saved yourself hours of work by bootstrapping this project with TSDX. Let’s get you oriented with what’s here and how to use it.
This TSDX setup is meant for developing libraries (not apps!) that can be published to NPM. If you’re looking to build a Node app, you could use
ts-node, or simple
If you’re new to TypeScript, checkout this handy cheatsheet
TSDX scaffolds your new library inside
To run TSDX, use:
npm start # or yarn start
This builds to
/dist and runs the project in watch mode so any edits you save inside
src causes a rebuild to
To do a one-off build, use
npm run build or
To run tests, use
npm test or
Code quality is set up for you with
lint-staged. Adjust the respective fields in
Jest tests are set up to run with
npm test or
This is the folder structure we set up for you:
/srcindex.tsx # EDIT THIS/testblah.test.tsx # EDIT THIS.gitignorepackage.jsonREADME.md # EDIT THIStsconfig.json
tsconfig.json is set up to interpret
esnext types, as well as
jsx. Adjust according to your needs.
A simple action is included that runs these steps on all pushes:
- Installs deps w/ cache
- Lints, tests, and builds
Please see the main
tsdx optimizations docs. In particular, know that you can take advantage of development-only optimizations:
// ./types/index.d.tsdeclare var __DEV__: boolean;// inside your code...if __DEV__console;
CJS, ESModules, and UMD module formats are supported.
The appropriate paths are configured in
dist/index.js accordingly. Please report if any issues are found.
Per Palmer Group guidelines, always use named exports. Code split inside your React app instead of your React library.
There are many ways to ship styles, including with CSS-in-JS. TSDX has no opinion on this, configure how you like.
For vanilla CSS, you can include it at the root directory and add it to the
files section in your
package.json, so that it can be imported separately by your users and run through their bundler's loader.
Publishing to NPM
We recommend using np.