Phát hành công cụ Chrome Dev với các chuỗi ký tự ES6/Số kiểu

Question

Tôi đang làm việc trên một dự án bằng cách sử dụng Typecript và một số tính năng ES6 được tiếp xúc bởi Typescript như ES6 String Literals, ví dụ: `Something ${variable} Something else`.

Trong khi gỡ rối một sự cố, tôi đã bỏ một điểm ngắt vào tệp bản ghi của mình để duyệt qua nó trong bảng nguồn, thường hoạt động tốt.

Nhưng công cụ Chrome Dev có vấn đề với chuỗi ký tự ES6 và dường như không nhận ra phần cuối của chuỗi ký tự ES6. Thay vào đó tất cả các mã theo chuỗi chữ được đánh dấu màu đỏ (chuỗi làm nổi bật trong trình gỡ lỗi) và bị chặn từ kiểm tra biến như trình gỡ lỗi chrome dường như nghĩ rằng đó là tất cả một chuỗi lớn.

Có ai đó gặp sự cố này, đã tìm thấy bản sửa lỗi hoặc biết liệu đây có phải là lộ trình của Google dành cho Công cụ dành cho Chrome Dev không?

CHỈNH SỬA 1:
Có vẻ như vấn đề này hiện đang được làm việc bởi nhóm Chromium. Xem báo cáo vấn đề cập nhật:
bugs.chromium.org/p/chromium/issues/detail?id=659515

EDIT 2: Bug đã được mở trong một thời gian khá lâu, nhưng dường như không được ưu tiên. Nếu bạn gặp sự cố, hãy truy cập liên kết chromium ở trên và gắn dấu sao/nhận xét trên đó với thông tin hữu ích để chuyển nó vào trọng tâm của nhóm Công cụ dành cho nhà phát triển.

Answer 1

Nếu bạn đang sử dụng Loại bản ghi, bạn có thể khắc phục sự cố này bằng cách biên dịch mã của bạn thành ES2015 và sử dụng bản đồ nguồn. Bằng cách này, các chuỗi nội suy được gạch chéo sẽ được chuyển đổi thành ol tốt '"string " + variable + " string", nhưng bạn vẫn có thể gỡ lỗi trong khi xem mã bản gốc của loại bản ghi với các dấu gạch chéo ngược.

này sẽ đòi hỏi thêm dòng sau vào tsconfig.json của bạn:

{ 
    "compilerOptions": { 
     "target": "ES2015", 
     "sourceMap": true, 
     ... 
    } 
    ... 
} 

Và nếu bạn phục vụ tại địa phương các tập tin được tạo ra nguồn bản đồ (.js.map) cạnh tạo .js file, bạn sẽ có thể để mở nguyên cảo tệp trong công cụ chrome dev trong "Nguồn" với Ctrl-p.

Answer 2

Nhận xét December 14, 2017 từ nhóm DevTools nói rằng họ đã cập nhật phiên bản CodeMirror được sử dụng trong DevTools và sự cố phải được khắc phục ngay bây giờ. Trong Chrome 64 trở lên, nó sẽ hoạt động. Trong các phiên bản trước của Chrome, phiên bản này sẽ vẫn bị hỏng. Bạn có thể kiểm tra phiên bản của mình tại chrome://version.