Skip to content

Latest commit

 

History

History
164 lines (116 loc) · 7.59 KB

README.md

File metadata and controls

164 lines (116 loc) · 7.59 KB
Raw

typescript-utilities-guide

a list of typescript helper libraries. advanced guides in typescript-cheatsheets will assume knowledge of these and refer people here.

There is a stage in every TypeScript journey where you struggle getting the types you want and eventually find a lifesaver blogpost like TypeScript Types You Should Know About. This cheatsheet accumulates them.

Automated JS to TS Conversion

JSON to TS type inference https://jvilk.com/MakeTypes/

Utility Types

Be familiar with the Utility Types that ship with TS. On top of that, here are handy Utility Types often used by TS practitioners, with explanation on what they do and how they can help. We will assume knowledge of mapped types and conditional types like Exclude<T, U> and ReturnType<T> but try to build progressively upon them.

Note: If you are new to conditional types, I highly recommend DJSheldrick's blogpost and talk on Conditional Types in TypeScript

Optionalize<T extends K, K>: Remove from T the keys that are in common with K 
/**
 * Remove from T the keys that are in common with K
 */
type Optionalize<T extends K, K> = Omit<T, keyof K>;

An example usage is in our HOC section below.

Nullable<T> or Maybe<T>: Make a Type into a Maybe Type 
/**
 * Make a Type into a Maybe Type
 */
type Nullable<T> = T | null
type Maybe<T> = T | undefined

Your choice of null or undefined depends on your approach toward missing values. Some folks feel strongly one way or the other.

Dictionary<T>: Dictionary of string, value pairs 
/**
 * Dictionary of string, value pairs
 */
type Dictionary<T> = { [key: string]: T }

[key: string] is a very handy trick in general. You can also modify dictionary fields with Readonly or make them optional or Omit them, etc.

There also exist helper type libraries:

seriously, check some of these out, they represent a ton of accumulated typescript experience.

Type Testing

TypeScript Plugins

You can write plugins to modify typescript syntax itself. this is ADVANCED and not exactly recommended but here are some examples if you need them:

types to runtime

Misc

API Extractor provides an integrated, professional-quality solution for all these problems. It is invoked at build time by your toolchain and leverages the TypeScript compiler engine to:

  • Detect a project's exported API surface
  • Capture the contracts in a concise report designed to facilitate review
  • Warn about common mistakes (e.g. missing exports, inconsistent visibility, etc.)
  • Generate *.d.ts rollups with trimming according to release type
  • Output API documentation in a portable format that's easy to integrate with your content pipeline

example https://github.com/framer/api-docs/tree/master/api

documentation

  • it transpiles TypeScript code examples to JavaScript
  • it typechecks your TypeScript code examples
  • it allows you to include Docblocks from your sourcecode

https://twitter.com/phry/status/1302662810707660801?s=20

monorepo build tooling

  • https://rushstack.io/ - Specific strategy that integrates popular tools like NodeJS, TypeScript, ESLint, Prettier, Webpack, Jest for large scale monorepos from Microsoft
  • https://nx.dev/react/guides/js-and-ts - Nx is a general-purpose build system and a general-purpose CLI. It works with JavaScript, TypeScript, Java, C#, Go, etc.. The core plugins Nx comes with do work best with JavaScript or TypeScript.
  • https://blog.mgechev.com/2018/11/19/introduction-bazel-typescript-tutorial/ - Bazel is a powerful tool which can keep track of the dependencies between different packages and build targets. For simplicity, we can think of a build target as a build rule - for example, “build a TypeScript library”

Codegen from TypeScript

Data Structures

https://github.com/basarat/typescript-collections