TypeScript

TypeScript est une version de javaScript typé

Les navigateurs ne lisent pas Ts il faut donc compiler ces fichiers pour les transformer en Js

Doc ici (TypeScript Documentation)

TypeScript nécessite une configuration pour être utilisé

Il fait un package.json spécifique

1{
2  "scripts": {
3    "build": "tsc", // npm run build pour lancer la compilation
4    "start": "node dist/index.js", // npm start pour demarer le server en déploiement
5    "dev": "nodemon ./index.ts" // npm run dev nodemon compile ts sans passer par build
6  },
7  "dependencies": {
8    "express": "^4.18.1",
9    "typescript": "^4.7.2"
10  },
11  "devDependencies": {
12    "@typescript-eslint/eslint-plugin": "^5.27.0",
13    "@typescript-eslint/parser": "^5.27.0",
14    "@types/express": "^4.17.13",
15    "nodemon": "^2.0.16",
16    "ts-node": "^10.8.0"
17  }
18}
19

Un .eslint.json qui lit TypeScript

1{
2  "env": {
3    "browser": true,
4    "es6": true,
5    "node": true
6  },
7  "parserOptions": {
8    "ecmaVersion": 2020,
9    "sourceType": "module"
10  },
11  "parser": "@typescript-eslint/parser",
12  "plugins": ["@typescript-eslint"],
13  "extends": ["eslint:recommended", "plugin:@typescript-eslint/recommended"],
14  "rules": {
15    "@typescript-eslint/indent": ["error", 4],
16    "quotes": ["error", "double"],
17    "semi": ["error", "always"],
18    "no-multi-spaces": "error",
19    "no-trailing-spaces": "error"
20  }
21}
22

Un fichier tsconfig.json qui permet la compilation des fichiers ts en js

1{
2  "compilerOptions": {
3    "target": "es6",
4    "module": "commonjs",
5    "outDir": "dist", // les fichiers compilés seront mis dans un dossier "dist"
6    "sourceMap": true
7  },
8  "files": [
9    "./index.ts", // list des fichier ts à compiler
10    "./app/router.ts"
11  ],
12  "exclude": ["node_modules"]
13}
14

Exemple pour un server de base

1import * as express from "express";
2
3const app = express();
4
5app.get("/", (req, res) => {
6  interface ReceivedMessage {
7    content: string;
8    pseudo: string;
9  }
10
11  async function saveMessage(message: ReceivedMessage) {
12    const savedMessage = message;
13    console.log("chat", savedMessage.content);
14  }
15
16  saveMessage({ content: "to", pseudo: "to" });
17
18  res.send("trop hype");
19});
20
21const PORT = process.env.PORT ?? 8000;
22app.listen(PORT, () => {
23  console.log(`server start on http://localhost:${PORT}`);
24});
25