Visual Studio Code - ปรับการตั้งค่าใบเสนอราคานำเข้า

เมื่อทำงานใน TypeScript ใน Visual Studio Code คำแนะนำการนำเข้าในประเภท (ทริกเกอร์โดยเว้นวรรค + ระยะเวลา) จะสร้างการนำเข้าโดยใช้เครื่องหมายคำพูดคู่

ลินเตอร์ TypeScript ของเราตรวจสอบว่ามีการใช้เครื่องหมายคำพูดเดี่ยวเมื่อเป็นไปได้

ดังที่คุณเห็นด้านล่างคำแนะนำมีเครื่องหมายคำพูดคู่ ("@angular / ... ")

ฉันจะปรับการตั้งค่าการนำเข้าได้อย่างไร

สำหรับ VSCode 1.10 สิ่งนี้ (น่าเศร้า) ยังไม่สามารถทำได้ แต่เป็นปัญหาสำหรับกลุ่มผู้ใช้ที่ดูเหมือนว่า ธีม VSCode ตระหนักถึงปัญหานี้และคุณสามารถทำตามสิ่งนี้เพื่อให้ทราบเมื่อมีการใช้งาน: https://github.com/Microsoft/TypeScript/issues/13270

อัปเดตมิถุนายน 2561

ตั้งแต่ VSCode 1.24 (มิถุนายน 2018) มีตัวเลือกสำหรับสิ่งนี้!

"typescript.preferences.quoteStyle": "single"

ดูข้อมูลเพิ่มเติมได้ที่:

https://code.visualstudio.com/updates/v1_24#_preferences-for-auto-imports-and-generated-code

คุณยังสามารถกำหนดค่าบรรทัดด้านล่างในการตั้งค่าผู้ใช้ vscode ของคุณเพื่อปรับการตั้งค่านี้

"prettier.singleQuote": true

ฉันแก้ไขโดยใช้Editor configเปิดไฟล์. editorconfigในไดเร็กทอรีรูทโปรเจ็กต์ของคุณ (ถ้าคุณไม่มีให้สร้างไฟล์นั้น) และเพิ่มบรรทัดนี้หลัง[*]

[*]
...
quote_type = single

ในวิกิคุณสามารถดูรายการคุณสมบัติทั้งหมด

ในรหัส VS 1.21.1 คุณต้องแก้ไข

/usr/share/code/resources/app/extensions/typescript-basics/snippets/typescript.json

ใน Windows

/ Applications / Visual Studio Code.app/Contents/Resources/app/extensions/typescript-basics/snippets/typescript.json

ใน Windows 10 (vscode เวอร์ชัน 1.30. * (การตั้งค่าผู้ใช้) ในภายหลัง)

* C: \ Users \ <yourusername> \ AppData \ Local \ Programs \ Microsoft VS Code \ resources \ app \ extensions \ typescript-Basis \ snippets \ typescript.json

ในส่วน 'นำเข้าโมดูลภายนอก' ของไฟล์นั้นทำให้คุณสมบัติ body array เป็นค่า"import { $0 } from '${1:module}';"จากนั้นส่วนจะมีลักษณะดังนี้:

"Import external module.": {
    "prefix": "import statement",
    "body": [
        "import { $0 } from '${1:module}';"
    ],
    "description": "Import external module."
},

อีกทางเลือกหนึ่งที่รองรับการกำหนดค่านี้คือTypeScript Toolboxกล่องเครื่องมือ

สามารถกำหนดค่าได้โดยการตั้งค่าgenGetSet.pathStringDelimiterซึ่งมีการนำเข้าใบเสนอราคาเดียวเป็นค่าเริ่มต้นอยู่แล้ว

ไปที่ "ไฟล์> ค่ากำหนด> การตั้งค่า" จากนั้นเพิ่มสิ่งนี้ภายใต้การตั้งค่าผู้ใช้:

"typescript.preferences.quoteStyle": "single",
"javascript.preferences.quoteStyle": "single"

ใน TypeScript 2.5 คำสั่งนำเข้าหรือส่งออกแรกในไฟล์จะถูกสแกนเพื่อตรวจสอบว่ามีการใช้เครื่องหมายคำพูดเดี่ยวหรือคู่เมื่อใช้คำแนะนำการนำเข้า

https://github.com/Microsoft/TypeScript/pull/17750

คุณยังสามารถกำหนดค่าบรรทัดด้านล่างในการตั้งค่าผู้ใช้ vscode ของคุณเพื่ออนุญาตใบเสนอราคาเดียวในสตริง

ไปที่การตั้งค่า> การตั้งค่าผู้ใช้

"prettier.singleQuote": true

สิ่งนี้จะอนุญาตให้มีเครื่องหมายคำพูดเดียวใน String มิฉะนั้นหากคุณเปลี่ยนเครื่องหมายคำพูดคู่ทั้งหมดเป็นคำพูดเดี่ยวด้วยตนเองระบบจะเปลี่ยนกลับขณะบันทึก นอกจากนี้เพิ่ม

"tslint.autoFixOnSave": true

เพื่อแก้ไขอัตโนมัติขณะบันทึก

สิ่งนี้ถูกนำไปใช้แล้ว (ตามที่กล่าวไว้ในคำตอบอื่น)! แต่คุณอาจยังไม่ได้ใช้ TypeScript เวอร์ชันล่าสุด

วิธีแก้ปัญหานั้นง่ายมาก:

คลิกหมายเลขเวอร์ชันของ TypeScript (เช่น 2.3.4) ระหว่าง "TypeScript" และหน้ายิ้มเล็กน้อยที่มุมล่างขวา จากนั้นเปลี่ยนเป็น Visual Studio Code ในตัวเวอร์ชัน (2.5.3 ในขณะนี้)

หลังจากโค้ด Visual Studio นี้จะสรุปรูปแบบใบเสนอราคานำเข้าโดยดูที่คำสั่งนำเข้าแรกสรุปรูปแบบใบเสนอราคานำเข้าโดยดูที่คำสั่งนำเข้าครั้งแรกโปรดทราบว่าป้ายป๊อปอัปเล็ก ๆ จะยังคงแสดงเครื่องหมายคำพูดคู่อยู่ดี

รายงานข้อบกพร่อง

คำขอดึงที่เกี่ยวข้อง :

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

วิธีแก้ปัญหาข้างต้นไม่ได้ผลสำหรับฉัน

ดังนั้นนี่คือวิธีแก้ปัญหาของฉันเมื่อคุณใช้ vscode "tslint.autoFixOnSave": true ในของคุณsettings.jsonจะแก้ไขใบเสนอราคานำเข้าเหล่านี้โดยอัตโนมัติเมื่อคุณบันทึกไฟล์