Creating an npm module ; whether it is for public servers or private purposes only is a tedious process for developers. Although there are different techniques to create a reusable package, TypeScript in Node.js is indisputably the best. Let us get going:
Defining npm: an overview
Node.js is a back-end JavaScript runtime environment running on the Chrome V8 engine. It is open-source and cross-platform and executes JavaScript code outside a web browser.
npm is Node.js' default package manager or Node.js Package Manager. npm has more than one million packages making it the most extensive software registry and in the world.
When you use npm, you get to access the world's largest library of reusable software. It simplifies sharing and reusing the code for developers.
Five benefits of using TypeScript
People might feel that strong typing is too much effort and time-consuming, but when you are working on package-development, TypeScript is the ideal choice. Here are five serious advantages of using TypeScript, especially in Node.js frameworks:
1. Flexibility for static typing
TypeScript is statically typed, which means the compiler can do all kinds of checking, and a lot of trivial bugs are caught at a very early stage.
However, when a programming language is dynamically typed, the errors are checked and spotted in the application only at the runtime — which could further delay the market launch and be costly.
Research says TypeScript detects 15% of common bugs at the compilation stage, which means developers can get the job done in a shorter time frame, productively.
2. High predictability for developers
When you work with TypeScript, everything stays as you defined it. If initially you declare a variable as a string in the application, it would not change. Thus, the software functions work precisely how they are intended to work, making it easier to launch.
3. Fast refactoring and updation
You must refactor your application without changing its behavior to keep your codebase robust. Thanks to TypeScript, this is a lot easier now. You have access to navigation tools such as "find all references" to do the job.
Also, as mentioned previously, developers can spot errors in the application early on. If you rename a function and forget to do so somewhere in the code, you will be alerted to do it. This accelerates the process of refactoring.
4. Access to a large talent pool
The number of active developers using JavaScript stands at over 11 million (and counting) worldwide who are committed to enhancing and protecting the security of JavaScript development. Those who do not work with TypeScript can still learn it pretty quickly if they have a JavaScript background.
5. Support from a thriving community
TypeScript is preferred by millions of active developers who regularly interact to make it a smarter, faster, and safer space. It is also backed by Microsoft that builds accountability and credibility of the language.
Some famous brands such as Slack, Airbnb, and Bloomberg rely on TypeScript to manage and maintain their large codebases. Microsoft also used TypeScript to write its cross-platform code editor Visual Studio Code.
Related Blog: Python vs Node Js- Which one to choose for project development?
Creating and publishing npm with TypeScript
Now that you know why TypeScript stands out in the market, let us look at how you can create and publish TypeScript npm packages. The process is easy if you know the right steps and follow them correctly. Here is a guide for doing so:
1. Install Node.js
Go to Node.js' downloads page and click on the version you need to install according to your configurations. You can choose a package for Windows OS, macOS, and pre-compiled Linux binaries and source code. Follow this guide by Node.js to install Node via package manager in your suitable operating system.
2. Pick an awesome name
This step allows you to get a little creative. Since there are more than 700K npm packages, you must choose a unique name that is easily searchable. The name you choose has to be in lowercase and pascal-case. How is "my-awesome-coder" sound to you?
3. Add TypeScript as a devDependency
Install your TypeScript as a devDependency which is installed only when you run the npm install and not when the user installs the package. That means TypeScript is not needed while using the package but only needed while developing it.
Once you install TypeScript, you will see a node_modules folder and a package-lock.json in your root. But to compile it, we also need a tsconfig.json file, so you must add it to the project root.
4. Ignore the compiled code in GIT
Usually, you do not want auto-generated files under your source control except for package-lock.json, as they create confusion and increase the chance of errors. Therefore, add your lib folder to ".gitignore." Here is how:
node_modules
/lib
Since you have added a slash before lib, it will ignore the lib folder at the top of the root, which we want in this case.
5. Follow formatting and linting rules
Your package must do so to attract more collaborators in the long run. You must add formatting tools such as devDependencies since they are only used to develop the package and not later on at the time of installation. You can also use formatting rules such as tslint.json: and a .prettierrc to format your package with presets.
6. Include only what you need in a package
We added our lib file in .gitignore as we do not want those build-files in our repository. In this step, it is precisely the opposite. We only want to focus on build-files. You can either blacklist the unnecessary files or whitelist the ones you want to use.
Since blacklisting is considered a bad practice, it is suggested that you whitelist the files and folders you want to publish. It is easier and effective. Here is how you can whitelist a file:
“files”: [“lib/**/*”]
Once you are through this step, the published package will only include the lib folder, whereas README.md and package.json are added to the former by default.
7. Set up testing with Jest
Your package must include unit tests to ensure it is error-free. Use Jest to set up testing. It is a JavaScript testing framework by Facebook that works excellent with TypeScript. It ensures your tests have a unique global state and reliably runs tests in parallel.
Since the tests are against the TypeScript source files, we need to add ts-jest and @types/Jest. This test suite is only used during Node.js development solutions, so let us add them as devDependencies. Here is how you can do that:
npm install --save-dev jest ts-jest @types/jest
8. Use the magic script in npm
Automation is the key to creating a practical and implementable package. You can use any of these scripts in npm:
- Prepare will run before the package is packed and published, and also after it is installed.
- prepublish Only will run before preparation and only when you publish npm.
- Perversion will run before you upgrade to a new package version. This ensures you do not bump up a new version of your package with a buggy code.
- Version will run after the package has been upgraded to a new version.
- Postversion will run after the commit has been made on the package.
9. Commit and push your code to GIT
Once your package is ready, it is time to push all your work to your remote repository. You must commit your latest code like this:
git add -A && git commit -m "Setup Package"
git push
Once this is done, publish your package by creating an NPM account or run the command: npm adduser
If you have an NPM account, use:
npm publish
The package will be first built by the prepare script. Post that, the test and lint will run by the prepublish Only script before the package is published.
The next steps
Wait — just because you have published the package does not mean your job is done. It would be best if you still kept upgrading the versions so that the package is always up-to-date.
You can use different sets of tools to enhance, test, and analyze your code after publishing, such as Travis , Codecov , and Shields ,. We hope this article has made it easier for you to create and publish a TypeScript npm Package. Good luck!
