Using npm with TypeScript

This guide will cover everything from installing TypeScript using npm to creating your own npm package in TypeScript.

What is npm?

npm is the default package manager for Node.js and is widely used to install and manage packages for JavaScript and TypeScript projects. It helps manage dependencies, execute scripts, and share packages with other developers.

For information on downloading and installing npm see the official installation guide.

Installing TypeScript via npm

To start using TypeScript in your projects, you first need to install it globally or locally using npm. This allows you to compile TypeScript files into JavaScript.

Global installation:

npm install -g typescript

This command installs TypeScript globally on your machine, allowing you to access the TypeScript compiler (tsc) from anywhere in your command line.

Local installation:

npm install --save-dev typescript

Local installation is preferred for project-specific setups, ensuring that other developers working on the project have the correct version when they run npm install.

Initializing a TypeScript project with npm

To initialize a new TypeScript project, start with creating a package.json file.

npm init -y

This command creates a basic package.json file with a default configuration. If you haven't already, install TypeScript locally and set up a tsconfig.json file, which is required to configure TypeScript options.

npm install --save-dev typescript
npx tsc --init

The npx tsc --init command generates a tsconfig.json file with default settings, which you can customize based on your project requirements.

Managing TypeScript versions with npm

To check the currently installed TypeScript version, you can use the following npm command:

npx tsc --version

This command outputs the version of TypeScript installed in your project, helping you ensure compatibility with your development environment.

Creating a TypeScript npm package

Creating an npm package with TypeScript involves a few specific steps to ensure your TypeScript is compiled correctly and that your package includes all necessary typings for users.

1. Set up your project: Initialize your project with npm init and configure your tsconfig.json as described earlier.
2. Organize your project: Structure your project with a src directory for your TypeScript code and a dist directory for the compiled JavaScript output.
3. Update package.json: Ensure your package.json points to the correct entry file, typically in the dist directory. For example:

"main": "dist/index.js",
"types": "dist/index.d.ts",

4. Write and compile your TypeScript: Once you've completed development of your package in the src directory, you can compile your TypeScript to JavaScript using the TypeScript compiler.

npx tsc

5. Publish your package: Once your code is tested and ready, publish it to npm.

npm login
npm publish

This logs you into your npm account and publishes your package, making it available for others to install via npm.

For further reading on using npm with TypeScript, see the official documentation.