Creating NPM Package with TypeScript
Creating NPM Package with TypeScript
Simplified TypeScript Guide to Building and Publishing Libraries
About the Book
Want to build and publish professional-quality TypeScript libraries to NPM—without being overwhelmed?
Creating NPM Package is a hands-on, step-by-step guide that teaches you how to configure, compile, test, and release TypeScript-based NPM packages like a pro.
Whether you’re new to TypeScript or ready to upgrade your publishing workflow, this book helps you master the full lifecycle of a reusable library—from clean project setup to automated GitHub releases.
What You’ll Learn
- Set up a TypeScript-powered project with confidence
- Compile TypeScript to both ECMAScript and CommonJS modules
- Separate and manage your source code and distribution files
- Define clear entry points and declaration files
- Run local tests before and after publishing to ensure package quality
- Write automation scripts for versioning, changelogs, and releases
- Create a production-ready README and LICENSE
- Publish to NPM with industry-standard workflows
Why This Book?
- Clear and simplified guidance for real-world TypeScript publishing
- Teaches modern best practices used by top library authors
- Helps you avoid common mistakes and manual setup headaches
- Perfect for devs who want a repeatable system for building NPM packages
Who Is This For?
✔ TypeScript developers ready to publish reusable libraries
✔ JavaScript developers who want to try out TypeScript
✔ Open-source contributors looking to streamline workflows
✔ Teams needing consistent, maintainable package setups
Whether you’re building your first open-source project or refining your professional publishing workflow, this book gives you everything you need to confidently ship clean, typed, and tested TypeScript libraries.
🚀 Stop guessing—start building like a pro!
About the Author
Table of Contents
- Introduction
- Welcome to Creating NPM Package with TypeScript!
- Why This Book Will Help You
- What You’ll Build
- Use the Right Tools
- What You Should Know First
- Got Questions?
- Let’s Begin!
- Project Configuration
- 1. Setting Up Your System
- 2. Creating a Project Directory
- 3. Creating a package.json File
- 4. Initializing a Git Repository
- 5. Specifying the Files Git Should Ignore
- 6. Staging and Committing Your Project’s Changes to Git
- 7. Configuring a GitHub Remote Repository
- 8. Uploading Your Local Git Directory to the Remote Repo
- 9. Installing TypeScript
- 10. Configuring the TypeScript Compiler
- Testing Package’s Code
- 1. Installing the Testing Tool
- 2. Specifying Jest as Your Project’s Test Runner Tool
- 3. Configuring Jest to Test TypeScript Code
- 4. Configuring Jest to Compile TypeScript Files
- 5. Setting Up Jest to Read TypeScript Configuration Files
- 6. Configuring Jest to Support ECMAScript Modules
- 7. Configuring Babel to Use the @babel/preset-env Preset
- 8. Setting Up Jest’s Testing Environment
- 9. Creating Your Code Files
- 10. Writing Your Test Case
- 11. Developing the Package’s Code
- 12. Running the Test
- Commit Message Configuration
- Conventional Commits Messages Syntax
- Enforcing the Conventional Commits Format
- Setting Up Husky
- Creating a Hook to Auto-Lint Commit Messages
- Setting Up GitHub Action
- 1. Creating a GitHub Action Workflow File
- 2. Defining the GitHub Action Workflow
- 3. Testing the GitHub Action Workflow
- Compiling TypeScript to JavaScript
- Compiling TypeScript to ECMAScript and CommonJS Modules
- Distinguishing Source and Distribution Code
- Specifying Items to Compile
- Defining Package’s Entry Point
- Specifying Package’s Declaration File
- Local Testing of Unpublished Package
- Link-Install Your Package Globally in Your System
- Creating a Directory for the Demo Website
- Creating a package.json File
- Initializing a Git Repository
- Specifying the Files Git Should Ignore
- Installing TypeScript
- Configuring the TypeScript
- Installing Your Package from Your System’s Global Folder to the Test App
- Using the Link-Installed Package in the Test App
- Creating the Demo Website’s Homepage
- Styling the Demo Website’s Elements
- Installing the Parcel Build Tool
- Specifying Parcel as Your Website’s Development Server
- Unlinking Your Package from the Test App
- Unlinking Your Package from the Global Folder
- Creating README
- Creating LICENSE
- Publishing Package to NPM
- 1. Search Engine Optimization (SEO)
- 2. Specifying the Files You Want to Publish to NPM
- 3. Confirm the Files NPM Will Publish
- 4. Confirm That You Have Passing Tests
- 5. Compile Any Pending Code
- 6. Stage and Commit Any Recent Changes
- 7. Push Your Local Git Directory to the Remote Repo
- 8. Sign In or Sign Up on the NPM Website
- 9. Log In to NPM via the Terminal
- 10. Confirm If Your Package’s Name Is Available
- 11. Publish Your Package!
- Local Testing of the Published Package
- 1. Installing the Package
- 2. Importing the Package
- 3. Running Your Local Server
- Production Testing of the Published Package
- 1. Staging and Committing Your Changes
- 2. Setting Up a GitHub Remote Repository for Your Demo Test App
- 3. Uploading Your Local Git Directory to the Remote Repo
- 4. Signing In or Signing Up on the Vercel Website
- 5. Deploying Your Project to Vercel’s Server
- 6. Testing the Package on the Live Demo Website
- Updating Package’s Versions
- Example 1: Updating to a Patch Version
- Example 2: Updating to a Minor Version
- Example 3: Updating to a Major Version
- Automating Version Management
- How to Release Your Package’s Latest Version
- How to Overwrite Release-It’s Default Configurations
- How Release-It Determines Your Package’s Latest Version
- How to Provide Release-It with a Recommended Version
- Automating Changelog Management
- Automating GitHub Releases
- 1. Getting a GitHub Personal Access Token
- 2. Copying the Generated Token
- 3. Creating a GitHub Environment Variable
- 4. Telling Release-It Your GitHub Token’s Name
- 5. Making the GitHub Secret Available Locally in Your Project
- 6. Preventing Git from Monitoring the Environment File
- 7. Installing the Plugin for Loading the .env File
- 8. Loading the .env File While Releasing Your Project’s Latest Version
- 9. Staging and Committing Your Changes
- Epilogue
- What’s Next?
- One Last Favor
- Introduction
The Leanpub 60 Day 100% Happiness Guarantee
Within 60 days of purchase you can get a 100% refund on any Leanpub purchase, in two clicks.
Now, this is technically risky for us, since you'll have the book or course files either way. But we're so confident in our products and services, and in our authors and readers, that we're happy to offer a full money back guarantee for everything we sell.
You can only find out how good something is by trying it, and because of our 100% money back guarantee there's literally no risk to do so!
So, there's no reason not to click the Add to Cart button, is there?
See full terms...
Earn $8 on a $10 Purchase, and $16 on a $20 Purchase
We pay 80% royalties on purchases of $7.99 or more, and 80% royalties minus a 50 cent flat fee on purchases between $0.99 and $7.98. You earn $8 on a $10 sale, and $16 on a $20 sale. So, if we sell 5000 non-refunded copies of your book for $20, you'll earn $80,000.
(Yes, some authors have already earned much more than that on Leanpub.)
In fact, authors have earnedover $14 millionwriting, publishing and selling on Leanpub.
Learn more about writing on Leanpub
Free Updates. DRM Free.
If you buy a Leanpub book, you get free updates for as long as the author updates the book! Many authors use Leanpub to publish their books in-progress, while they are writing them. All readers get free updates, regardless of when they bought the book or how much they paid (including free).
Most Leanpub books are available in PDF (for computers) and EPUB (for phones, tablets and Kindle). The formats that a book includes are shown at the top right corner of this page.
Finally, Leanpub books don't have any DRM copy-protection nonsense, so you can easily read them on any supported device.
Learn more about Leanpub's ebook formats and where to read them
