VSCode 最低 TypeScript 項目

Question

編輯：我不想要或不需要瀏覽器，我只想在節點內運行所有內容。

我正在嘗試在 VSCode 中創建一個 TS 項目並且遇到了困難。 我已經使用 VSCode 創建和運行 Angular 7-9 和 AngularJS 項目，但我不想通過所有設置/測試 go 來運行一些 TS 代碼。 今晚之前我從未創建過“僅節點”項目，但我已經能夠執行一個能夠讀取一個TS 文件但不能導入其他文件的 JS 文件。

我正在尋找 .tsconfig 設置、package.json 設置和“正常工作”的導入/要求語句的神奇組合。

index.js 現在的樣子。 我嘗試過 require、此導入和“ts 樣式”導入，但錯誤程度不同（取決於接下來的 2 個文件）。 如果我不導入任何東西，console.log 執行得很好。 在某一時刻，我能夠“導入”（或需要？）一個編譯的 TS 文件，該文件沒有導入任何其他 TS 文件，並且代碼執行得很好。

    import ts from "./dist/start.js";
    console.log("starting");

package.json 目前的位置。 到目前為止，添加“type: module”和“--experimental-modules”感覺讓我走得最遠。

{
    "name": "test",
    "version": "1.0.0",
    "main": "index.js",
    "scripts": {
        "go": "tsc & node --experimental-modules index.js"
    },
    "dependencies": {},
    "devDependencies": {
        "typescript": "^3.9.3"
    },
    "type": "module"
}

tsconfig.json 當前所在的位置。 我嘗試從 angular 項目中復制一個，擺弄 module/moduleResolution/target 設置，以及我在網上找到的其他一些東西。

{
    "compilerOptions": {
        "baseUrl": "./",
        "outDir": "./dist",
        "sourceMap": true,
        "declaration": false,
        "downlevelIteration": true,
        "experimentalDecorators": true,
        "module": "es2015",
        "moduleResolution": "node",
        "importHelpers": true,
        "target": "es2015",
        "lib": [
            "es2018",
            "dom"
        ]
    }
}

為了完整起見，我的 TS: cat.ts:

    export class Cat {
        constructor(public name: string) {}

        public meow(): void {
            console.log(this.name + " says 'Meow!'");
        }
    }

開始.ts：

    import { Cat } from "./cat"
    const cat = new Cat("sam");
    cat.meow();
    // just in case something needs to be exported.
    export const ts = "";

Answer 1

使用包裹捆綁器。 https://parceljs.org/

Parcel 將自動為您安裝和配置大多數依賴項，包括 TypeScript。 這超級簡單。

或者 go 到codesandbox.io並開始一個新項目，也許 Vanilla + TS 是您正在尋找的。 From the project editor you can select File -> Export to ZIP and download the project, including its package.json and tsconfig.json files. （Codesandbox.io 在引擎蓋下使用包裹）

那里也有很多 TypeScript 樣板代碼庫，但我喜歡 codeandbox.io 因為它超級快速且易於上手，而且您仍然可以下載項目文件。 而且，它基本上內置了 VSCode 編輯器。