Creating NPM Package with Vanilla JavaScript
Creating NPM Package with Vanilla JavaScript
Build, Test & Publish Vanilla JavaScript Libraries Like a Pro
About the Book
Want to master the art of building and publishing your own NPM packages? The "Creating NPM Package" book is your step-by-step guide to crafting high-quality, production-ready JavaScript libraries from scratch—and getting them into the hands of developers around the world.
Whether you’re a beginner looking to publish your first package or a seasoned developer ready to streamline your release pipeline, this book walks you through every essential stage of the process.
What You’ll Learn:
- Configure your project like a pro with robust tooling from the start
- Write reliable tests to ensure your component works as expected
- Set up GitHub Actions for automated workflows and CI/CD
- Define clear entry points for your package to support consumers
- Test your library locally—before and after publishing
- Create professional README and LICENSE files that boost trust
- Learn the correct and safe way to publish to NPM
- Master semantic versioning and update your package like a pro
- Automate changelog generation and GitHub releases for effortless updates
Why This Book?
- Clear, practical, and beginner-friendly guidance
- Covers modern, best-practice workflows used by top open-source developers
- Helps you turn your code into a trusted, reusable NPM library
- Saves you time with automation tips that reduce manual work
Start publishing like a professional developer.
About the Author
Table of Contents
- Introduction
- Welcome to NPM Package!
- How This Book Can Help You
- The Roadmap
- Dependencies
- Prerequisite
- Questions and Comments
- Let’s Get It Started!
- 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
- Testing JavaScript Component
- 1. Installing the Testing Tool
- 2. Specifying Jest as Your Project’s Test Runner Tool
- 3. Configuring Jest to Support ECMAScript Modules
- 4. Configuring Babel to Use the @babel/preset-env Preset
- 5. Configuring Jest’s Testing Environment
- 6. Creating Your Code Files
- 7. Writing Your Test Case
- 8. Developing Your JavaScript Code
- 9. 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
- Defining Package’s Entry Point
- 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 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. Specify the Files You Want to Publish to NPM
- 3. Confirm the Files NPM Will Publish
- 4. Confirm That You Have Passing Tests
- 5. Stage and Commit Any Recent Changes
- 6. Push Your Local Git Directory to the Remote Repo
- 7. Sign In or Sign Up on the NPM Website
- 8. Log In to NPM via the Terminal
- 9. Confirm If Your Package’s Name Is Available
- 10. 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
