ค้นหาเว็บไซต์

Visual Studio Code - VSCode ไม่แสดงการนำเข้าที่หายไปใน TypeScript


ฉันเพิ่งสร้างโปรเจกต์ TypeScript ใหม่ในโฟลเดอร์ใหม่ TypeScript คือเวอร์ชัน 4.4.2

โครงสร้างโฟลเดอร์มีดังนี้

- myProject
  -src
   -folder-1
     -file-1.ts
   -folder-2
     -file-2.ts
  -tsconfig.json

ไฟล์ที่มีตรรกะนั้นง่ายมาก

file-1.ts

function function_1() {
    console.log('Print something');
}

ไฟล์-2.ts

function function_2() {
    function_1();
}

สิ่งที่ฉันคุ้นเคยในการเห็นคือ VSCode แสดงข้อผิดพลาดสีแดงในบรรทัดเดียวของฟังก์ชัน function_2 เนื่องจาก function_1 ไม่ได้ถูกนำเข้า (และแม้แต่จะไม่ได้ถูกส่งออกด้วย)

ในทางตรงกันข้าม VSCode ไม่แสดงข้อผิดพลาดใด ๆ ในทางตรงกันข้าม เมื่อกด CTRL+Click บนบรรทัด function-1() ของ file-2.ts VSCode จะเปิดการทำงานจริงของ function-1 ใน file-1

นอกจากนี้ ถ้าฉันรัน tsc ตัวคอมไพเลอร์จะไม่แจ้งข้อผิดพลาดและจะสร้างไฟล์ *.js ที่เกี่ยวข้องในโฟลเดอร์ dist ตามปกติ ถ้าฉันลองรัน function-2() ฉันจะได้รับข้อผิดพลาดแจ้งว่า "function_1 ไม่ได้ถูกกำหนด"

นี่คือ tsconfig.json ของฉัน

{
    "compilerOptions": {
        "target": "es6",
        "module": "commonjs",
        "outDir": "dist",
        "sourceMap": true,
        "allowJs": true,
        "noUnusedLocals": true,
        "noUnusedParameters": true,
        "resolveJsonModule": true
    },
    "include": ["src/*.ts", "src/**/*.ts"],
    "exclude": ["node_modules"],
    "typeRoots": ["node_modules/@types"],
    "lib": ["es2016", "dom"]
}

รายละเอียดอีกนิด ถ้าฉันรันคำสั่ง npm run tsc src/folder-2/file-2.ts (ซึ่ง tsc เป็นสคริปต์มาตรฐานของ npm สำหรับรันคอมไพเลอร์ TypeScript) ฉันจะได้ข้อผิดพลาดบนคอนโซล แต่คอมไพเลอร์ยังคงสร้าง file-2.js เป็นผลลัพธ์ของมัน

ฉันค่อนข้างแน่ใจว่าฉันกำลังพลาดบางอย่างที่โง่ ๆ แต่ฉันไม่สามารถเห็นมันได้

บทความที่เกี่ยวข้อง