microsoft / microsoft/TypeScript

`verbatimModuleSyntax` leaves empty curly brackets in the JS output

Đang mở
#62,239 1 bình luận 0 reaction 0 người được giao Xem trên GitHub

Chưa có ai nhận issue này.

Domain: ES Modules Help Wanted Possible Improvement
Ngôn ngữ chính
Go
Star
111k
Fork
14.3k
Merge trung bình
2 ngày 4 giờ
Pull request đã merge (30 ngày)
132

Mô tả

🔎 Search Terms

"verbatimModuleSyntax", "curly brackets", "empty brackets"

🕗 Version & Regression Information
  • This is the behavior in every 5.x version I tried, and I reviewed the FAQ for entries about verbatimModuleSyntax
⏯ Playground Link

https://www.typescriptlang.org/play/?jsx=4&verbatimModuleSyntax=true&ts=5.9.2#code/JYWwDg9gTgLgBASRAQwOYFMA0cDeMCeY6iKGAClBGAM4C+cAZpSHAEQB26AHjAPShp0AOgBW1VgG4AUFO6RYcACboGyAK4AbeAzXsAxjGAR2JQQHUoyMESgAKMJRoAuU+UfUAlLilxfcKOgwalAmADxIgrhC0Q5UdLwAfFK0UkA

💻 Code
import Image, {type ImageProps} from "next/image.js";

export default function ImageWrapper(props: ImageProps) {
    return <Image {...props}/>
}
🙁 Actual behavior

TS produces the following JS output when verbatimModuleSyntax is set to true:

import { jsx as _jsx } from "react/jsx-runtime";
import Image, {} from "next/image.js";
export default function ImageWrapper(props) {
    return _jsx(Image, Object.assign({}, props));
}

Notice the empty curly brackets in the import statement that were left off after removing type-only named imports.

🙂 Expected behavior

The empty curly brackets are unnecessary in this case. It is precisely the output TS produces when verbatimModuleSyntax is not enabled:

import { jsx as _jsx } from "react/jsx-runtime";
import Image from "next/image.js";
export default function ImageWrapper(props) {
    return _jsx(Image, Object.assign({}, props));
}

https://www.typescriptlang.org/play/?jsx=4&verbatimModuleSyntax=false&ts=5.9.2#code/JYWwDg9gTgLgBASRAQwOYFMA0cDeMCeY6iKGAClBGAM4C+cAZpSHAEQB26AHjAPShp0AOgBW1VgG4AUFO6RYcACboGyAK4AbeAzXsAxjGAR2JQQHUoyMESgAKMJRoAuU+UfUAlLilxfcKOgwalAmADxIgrhC0Q5UdLwAfFK0UkA

Additional information about the issue

No response

Hướng dẫn đóng góp

Mở hướng dẫn đóng góp

Bắt đầu từ đâu

  1. Đọc hết issue, rồi đọc hướng dẫn đóng góp của dự án.
  2. Bình luận trên issue rằng bạn sẽ nhận — tránh hai người làm cùng một việc.
  3. Fork repository và làm thay đổi trên một nhánh.
  4. Mở pull request có tham chiếu số hiệu của issue.

Hướng nghiên cứu

Bắt đầu với bản tái hiện TypeScript Playground được liên kết, sử dụng verbatimModuleSyntax và import TSX được nêu trong issue. So sánh output được tạo ra khi có và không có tùy chọn này; hoàn tất khi các named import chỉ dùng cho type được loại bỏ mà không để lại cặp ngoặc nhọn rỗng trong import JavaScript.

Do mô hình lập chỉ mục viết ra từ nội dung của issue.

Đánh giá

Công nghệ
typescript
Lĩnh vực
compilers
Loại issue
Lỗi
Độ khó
3/5
Thời gian dự kiến
1-2 ngày
Mức độ hoạt động
Đình trệ
Độ rõ ràng
Khá rõ ràng
Mức phù hợp với người mới
45/100

Nhận issue mới trong hộp thư của bạn

Bản tóm tắt ngắn những issue GitHub phù hợp với người mới.