1.10.2. fejezet, VS Code

Beküldte pzoli - 2023, január 6 - 7:48du

Kapcsolódó hivatkozások

TypeScript telepítése

Bővítmények

NodeJS telepítését követően futtassuk az alábbi scriptet:

npm install -g typescript

Szerver komponens telepítése

npm install --save-dev lite-server

VS Code bővítmények

Konfigurációs fájlok

tsconfig.json (a "tsc --init" hozza kétre)

{
    "compilerOptions": {
        "target": "ES6",
        "module": "CommonJS",
        "outDir": "dist",
        "sourceMap": true,
        "allowJs": true,
    }
}

package.json (az "npm init" hozza létre)

{
    "name": "HelloWorld",
    "version": "1.0.0",
    "description": "Example project",
    "main": "dist/hello-world.js",
    "scripts": {
        "build": "tsc",
        "start": "lite-server"
    },
    "license": "MIT",
    "dependencies": {
        "typescript": "^4.9.4"
    },
    "devDependencies": {
        "lite-server": "^2.6.1"
    }
}

A függőségek telepítéséhez használjuk a következő parancsot:

npm install

launch.json

{
    "version": "0.2.0",
    "configurations": [
        {
            "type": "node",
            "request": "launch",
            "name": "Launch Program",
            "skipFiles": [
                "<node_internals>/**"
            ],
            "program": "${workspaceFolder}\\dist\\hello-world.js",
            "preLaunchTask": "tsc: build - tsconfig.json",
            "outFiles": [
                "${workspaceFolder}/**/*.js"
            ]
        }
    ]
}

Szerver indítása

npm start

Fordítás automatizálása

tsc --watch

Formázási beállítások

Handlebars *.hbs fájlok automatikus formázásának kikapcsolására a c:\Users\{USERNAME}\AppData\Roaming\Code\User\settings.json fájlba illesszük be az alábbiakat (vagy adjuk ki VSCode-ban a Preferences: Open User Settings (JSON) parancsot):

"[handlebars]": { "editor.formatOnSave": false }