Small knowledge, big challenge! This article is participating in the creation activity of “Essential Tips for Programmers”.

As a full-stack developer, it’s fun to create projects, to design architecture, to brainstorm, to develop, but after development is done, we deploy or release the application. So how to deploy a TS Node.js project correctly and quickly, today we’ll figure it out.

Create a TS Node.js application

If you’re already familiar with creating TS Node.js projects, you can skip to the “Deploy and publish Applications” section

Initialize the Node.js project:

On our team, we love TS and use it in all of our new projects, so creating a TS project is not new.

Let’s start with the basics:

  1. npm initInitialize a Node.js project using-yParameters can quickly skip step – by – step configuration
  2. npm install express @types/expressInstall the Express dependencies, and the Types file for EXPRESS for TS development
  3. npm install typescript --save-devInstall typescript as a development dependency
mkdir my-app && cd my-app
npm init -y
npm install express @types/express --save
npm install typescript --save-dev
Copy the code

TS configuration

  • npx tsc --initA typescript default configuration file, tsconfig.json, is created
  • declarationUsed to specify whether to generate the corresponding *.d.ts file after compilation. The default is false
  • outdirDefine the TS compiled directory, if not declared, the default compiled file location will be the same as the TS source file location

Run the command

 npx tsc --init
Copy the code

Modify the following configuration

"compilerOptions": {..."outDir": "dist".// Output directory after compilation
  "declaration": true / / generated which s
}
Copy the code

Create the project entry file

Create the server.ts file

import express from 'express'
const app = express()
const PORT = 3000

app.use(express.json())

app.get('/'.(req, res) = >{res. Send (" Hello World! ')}) app. Listen (PORT,() = > {
  console.log(`Server is listening on port ${PORT}`)})Copy the code

After completing the above steps, our file directory structure is as follows

.├ ── ├─ package-lock.json ├─ Package-lock. json ├─ serverCopy the code

Compile the TS

Our next step is to build and deploy our TS Node.js application, since we don’t run the TS version in production, we run compiled JS instead. Now let’s compile the project

Modify package.json file to add the following command

  1. npm run tscOur project will be compiled based on our tsconfig.json configuration and output to the specified directory
  2. npm run start:prodThis will run our compiled JS file
"scripts": {
  "tsc": "tsc"."start:prod": "node dist/server.js"
}
Copy the code

Then test it locally

npm run tsc
npm run start:prod

Service started successfully, running port: 3000
Copy the code

Visit http://localhost:3000/ via your browser, access is successful, and we deploy and publish our application

Deploying and publishing applications

There are two main ways to deploy the compiled TS project distribution to a variety of environments

  • NPM dependency package form
  • Docker container mode

NPM dependency package form

NPM lifecycle hooks

Some special lifecycle hooks are triggered when the specified action is triggered. In this case, we will use the “prepare” hook, which is triggered once before the NPM publish command is issued to the NPM. So we can compile the TS application at this time.

Specify publish file

The “Files” field defines which files should be included when distributing the NPM package. If omitted, the default is [“*”], and all files will be uploaded.

Here is the modified package.json

"name": "my-app-xiaoshuai".// The name we posted to NPM
"main": "dist/server.js".// Change the address of the entry file
"types": "dist/server.d.ts".// Specify a TS file
"files": [
  "dist"."package.json"."package-lock.json"."README.md"]."scripts": {
  "tsc": "tsc"."prepare": "npm run tsc"  / / edit typescript
}
Copy the code

npm publish

After modifying the package.json configuration, we ran NPM publish to publish our application to NPM

npm publish
Copy the code

The output

After the successful release, you can see that NPMJS has a my-app-xiaoshuai package

Docker container mode

To publish our TS Node.js application as a container, we create the Docker configuration file Dockerfile in the project root directory.

Let’s write the Dockerfile file step by step

  1. Copy the compiled file into the container
  2. Copy package.json and package-lock.json to the container
  3. usenpm installInstall dependencies
  4. usenode build/server.jsRun our application
Alpine ARG NODE_ENV=production ENV NODE_ENV $NODE_ENV COPY./dist /dist COPY./package.json /package.json COPY ./package-lock.json /package-lock.json RUN NODE_ENV=$NODE_ENV npm install EXPOSE 3000 CMD ["node", "dist/server.js"]Copy the code

Now we can build the docker image in the root directory and run docker build –tag my-app:test. The command

docker build --tag my-app:test .
Copy the code

If successful, the following output is displayed

Docker run -p 3000:3000 -it my-app:test docker run -p 3000:3000 -it my-app:test

docker run -p 3000:3000 -it my-app:test
Service started successfully, running port: 3000
Copy the code

Access http://localhost:3000/. The access is successful

The source code

Github.com/cmdfas/ts-n…

conclusion

Today we’ve covered the basics of creating a TS Node.js project and deploying it, which we hope will help you use in your current or future projects.

If this article is helpful, wechat search [xiaoshuai’s programming notes], let us progress every day