I have tried setting up an express typescript project on a few occasions, and on each occasion, I end up having to go through several articles to solve that problem. Setting up an express typescript project can be a bit challenging, especially if you are not familiar with either express or typescript.
This is one of the reasons I prefer nest over express as nest comes with typescript setup and is configured automatically upon initialization.
My solution to this is to create an article that I could always refer to when I am starting a new express typescript project. However, I'd be even happier if this article becomes of use to someone else who shares the same problem.
Before we begin, I am going to assume you have nodejs and typescript installed locally. To find out if you have both typescript and node installed, simply open up your terminal or command prompt and type the command tsc --version and node --version. If you have them installed, your terminal or command prompt should return the versions of typescript and node installed, just like in the picture below.
If your terminal does not resemble the picture above, simply install nodejs and typescript. You can simply google how to do that. To start the project, simply navigate to the folder you want to start the project and create a folder. You can then initialize a node project by running the command npm init -y. you should see an output like the one below.
The package.json file is going to contain the metadata for your node projects. After that, all that is left is to initialize
typescript and that can be done by running the tsc --init command which returns the output below.
The tsconfig.json file contains all the configuration settings for the typescript compiler. Feel free to browse through
it and edit as you see fit. More often than not, the default configurations should be more than enough.
- express is the framework for building web applications,
- dotnev is used to access environment variables,
- nodemon automatically restarts the server when code changes are detected during development
- ts-node allows us to run typeScript code directly without compiling
You simply install them by running npm install express dotenv
while you install nodemon as npm install nodemon ts-node -D. This specifies that nodemon be installed as a development dependency as it is only used during development.
After installation is complete, open up the package.json file and add the following scripts under the scripts section
"start": "node dist/index.js",
"dev": "nodemon --watch src --exec ts-node src/index.ts",
"build": "tsc -p"
You should have something like the image below.
The "build" script tells typescript to build and compile the project into javascript, the "start" script contains
instructions to run the compiled javascript code, and the "dev" script is used to start the server in development mode using
nodemon and ts-node. It automatically starts the server after each save.
If you have successfully done all of the above without any errors, then congratulations. You can now start building web applications with both express and typescript.
Top comments (0)