Adding TypeScript to NPM Packages
Adding TypeScript to 3rd party modules in 2019 is a breeze thanks to Babel and TypeScript.

I've been using TypeScript in my projects for the past month or so. After a two year hiatus, it finally seems right for me. Using it in an app is documented everywhere, but adding it into a package for NPM seems more scattered. Here's a real easy way to set this up with Babel 7.
Install TypeScript
npm install typescript --save-dev
Next, let's install the needed Babel 7 dependencies:
npm install @babel/cli @babel/core @babel/preset-typescript --save-dev
If you are building something with React, you will want to have @babel/preset-react
and @types/react
saved as devDependencies
as well.
Add Build Scripts
Next lets add a couple build scripts to our package.json
:
"build": "npx babel src --out-dir lib --extensions \".ts,.tsx\"",
"export-types": "tsc --emitDeclarationOnly",
"check-types: "tsc"
Add Two Configuration Files
Let's create our .babelrc
file:
{
"presets": ["@babel/preset-react", "@babel/typescript"]
}
If you aren't using React, leave that one out.
We're almost done, now let's create our tsc…
Keep reading with a 7-day free trial
Subscribe to zach.codes to keep reading this post and get 7 days of free access to the full post archives.