zach.codes

Share this post

User's avatar
zach.codes
Adding TypeScript to NPM Packages
Copy link
Facebook
Email
Notes
More

Adding TypeScript to NPM Packages

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

Zach Silveira
Jun 13, 2019
∙ Paid

Share this post

User's avatar
zach.codes
Adding TypeScript to NPM Packages
Copy link
Facebook
Email
Notes
More
Share
Adding TypeScript to NPM Packages

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.

Already a paid subscriber? Sign in
© 2025 Zach Silveira
Privacy ∙ Terms ∙ Collection notice
Start writingGet the app
Substack is the home for great culture

Share

Copy link
Facebook
Email
Notes
More