vscode import import import = ต้องการ (“ console”); อัตโนมัติ

import console = require("console");

console.<< ฉันพิมพ์ และข้างต้นจะถูกนำเข้าโดยอัตโนมัติใน VScode ใครรู้วิธีปิดการใช้งานนั้น

(ฉันถือว่ามันเป็นหนึ่งในส่วนขยายของฉันน่าจะสวยกว่านี้)

แก้ไข: มันเกิดขึ้นเฉพาะในสภาพแวดล้อมของ React typescript ไม่ได้อยู่ใน typescript โดยไม่มีการตอบสนอง

ข้อจำกัดความรับผิดชอบ: สิ่งนี้ไม่ควรถูกพิจารณาว่าเป็น "ทางออก" แต่เป็นวิธีที่ง่ายที่สุด

คำตอบนี้สมมติว่าคุณกำลังใช้ VSCode IDE อื่น ๆ ควรคล้ายกัน

1. เริ่มพิมพ์ console
2. คลิกป้อนหรือพิมพ์.อนุญาตให้เพิ่มIntelliSenseimport console = require("console");
3. Ctrl + คลิก (หรือ F12 หรือ Cmd + คลิกที่ macOS) บน require("console")
4. แสดงความคิดเห็นรหัสนี้:

declare module "console" {
    export = console;
}

ฉันพบสิ่งนี้ด้วยและดูเหมือนว่าจะมีปัญหากับฟีเจอร์นำเข้าอัตโนมัติใน VSCode การปิดใช้งานส่วนขยายทั้งหมดดูเหมือนจะไม่ทำให้ส่วนขยายหายไป

คุณสามารถปิดใช้งานการนำเข้าอัตโนมัติในการตั้งค่า

ถ้าคุณใช้ Javascript

"javascript.suggest.autoImports": false

ถ้าคุณใช้ typescript

"typescript.suggest.autoImports": false

แก้ไข: นำเข้าอัตโนมัติผิดพลาดเกิดขึ้นเนื่องจากรหัสนี้ในแพคเกจลงต้นไม้พึ่งพา

declare module "console" {
    export = console;
}

แพ็กเกจสามารถอยู่ในไดเร็กทอรี node_modules โลคัลของคุณหรือในแพ็กเกจที่อ้างอิงที่ติดตั้งแบบโกลบอล

1. ค้นหา node_modules ในพื้นที่ของคุณ declare module "console"
2. หากคุณพบมันในแพคเกจท้องถิ่นเรียกใช้npm list [packageName]เพื่อตรวจสอบว่าแพคเกจใน package.json ขึ้นอยู่กับแพคเกจด้วยรหัสคอนโซลในนั้น

หากคุณไม่พบรหัสใน node_modules ท้องถิ่นของคุณคุณสามารถทำได้

1. กำจัดแพ็คเกจทีละรายการใน package.json

2. ค้นหารหัสคอนโซลในโมดูลที่ติดตั้งทั่วโลกซึ่งอาจอ้างอิงโดยแพ็คเกจในโครงการของคุณ

% USERPROFILE% \ AppData \ Roaming \ npm \ node_modules% USERPROFILE% \ AppData \ Local \ Microsoft \ TypeScript

ฉันรู้ว่านี่ไม่ใช่วิธีแก้ปัญหาที่ตรงไปตรงมา แต่ฉันหวังว่ามันจะช่วยได้ในกรณีของฉันฉันมีการอ้างอิงจาก react-native-copilot -> rimraf -> โหนดซึ่งมีรหัสคอนโซลอยู่ การลบ react-native-copilot ออกเพื่อแก้ไขปัญหา

ทางออกที่ดีที่สุดที่ฉันพบคือการสร้างconsole.d.tsไฟล์จำลองในโครงการของคุณ:

declare module 'console' {
    export = typeof import("console");
}

สิ่งนี้จะป้องกันการนำเข้าอัตโนมัติ

เครดิต: https://github.com/Microsoft/TypeScript/issues/30471#issuecomment-474963436

หากคุณเพิ่มตัวอย่างสำหรับการแทรกconsole.logและใช้สิ่งนั้นแทนจะไม่มีการนำเข้า "คอนโซล" โดยอัตโนมัติ

https://code.visualstudio.com/docs/editor/userdefinedsnippets#_create-your-own-snippets

นี่คือตัวอย่างของฉัน:

{
    "Print to console": {
        "prefix": "cl",
        "body": [
            "console.log('$1');",
        ],
        "description": "Log output to console"
    }
}

ถ้าคุณชอบฉันลืม "cl" คุณสามารถใช้คำนำหน้าหลายคำในตัวอย่างได้ :)

{
    "Print to console": {
        "prefix": ["cl","co","con","cons","conso","consol","console", "console.l","console.lo","console.log"],
        "body": [
            "console.log($1);",
        ],
        "description": "Log output to console"
    }   
}

วิธีหนึ่งในการป้องกันไม่ให้สิ่งนี้เกิดขึ้นคือการปรับเปลี่ยนไฟล์ tsconfig.json ของคุณเพื่อ จำกัด ชุดประเภทที่จะนำเข้าสู่โครงการของคุณโดยอัตโนมัติ

ฉันมีปัญหาเดียวกันนี้และฉันแก้ไขได้โดยการเพิ่ม:

types: []

ลงในไฟล์ tsconfig.json ของฉัน สิ่งนี้จะปิดการใช้งานของ TypeScript (และโดยส่วนขยาย VSCode) จากการนำเข้าแพคเกจโหนดทั้งหมดที่อยู่@types/ในการกำหนดค่าโครงการโดยอัตโนมัติ สิ่งนี้ไม่ได้ป้องกัน TS จากการนำเข้าคำจำกัดความประเภทเหล่านั้นหากคุณนำเข้าแพคเกจโดยใช้ประเภทเหล่านั้นอย่างชัดเจน

ในกรณีเฉพาะของฉันconsoleคำจำกัดความมาจาก@types/nodeซึ่งได้ถูกนำเข้าสู่โครงการเป็นการอ้างอิงของ Storybook อย่างไรก็ตามโครงการของฉันเป็นโครงการ webpack ตั้งใจให้ทำงานในเบราว์เซอร์ดังนั้นการนำเข้าประเภท Node.js ลงในซอร์สโค้ดของฉันไม่สมเหตุสมผล ชุดฐานชนิดที่คุณต้องการใช้ในเบราว์เซอร์คือประเภท dom ไม่ใช่ประเภทโหนด

ขึ้นอยู่กับโครงการของคุณคุณอาจต้องเพิ่มชุดของประเภทแพคเกจฐานลงในพารามิเตอร์ประเภท ( types: ["dom", "react"]และอื่น ๆ ) อย่างไรก็ตามในกรณีของฉันสิ่งนี้กลับกลายเป็นว่าไม่จำเป็นโครงการของฉันสามารถรวบรวมได้ดีกับรายการที่ว่างเปล่า และแนวโน้มของ VSCode ที่จะนำเข้า 'คอนโซล' โดยอัตโนมัติดูเหมือนจะหายไปหมดแล้ว ฉันไม่ได้สังเกตเห็นผลร้ายอื่น ๆ จนถึงตอนนี้

ข้อมูลเพิ่มเติมเกี่ยวกับประเภทการตั้งค่าใน tsconfig.json ที่นี่: https://www.typescriptlang.org/docs/handbook/tsconfig-json.html