Tôi muốn thay đổi / thêm tô sáng cú pháp cho một ngôn ngữ trong Sublime 2/3.

Ví dụ: tôi muốn từ khóa được thistô màu bằng JavaScript.

Làm thế nào tôi có thể làm điều đó?

Tôi biết rằng có một Tệp C:\Program Files\Sublime Text 3\PackagesJavaScript tùy chọn trong thư mục này, nhưng tôi không biết phải thay đổi những gì hoặc liệu tôi có phải tạo một Tệp Tùy chọn JavaScript mới ở đâu đó trong thư mục này hay không %APPDATA%\Sublime Text 3.

Đánh dấu cú pháp được kiểm soát bởi chủ đề bạn sử dụng, có thể truy cập thông qua Preferences -> Color Scheme. Các chủ đề làm nổi bật các từ khóa, hàm, biến, v.v. khác nhau thông qua việc sử dụng phạm vi, được xác định bởi một loạt các biểu thức chính quy có trong .tmLanguagetệp trong thư mục / gói của ngôn ngữ. Ví dụ, các JavaScript.tmLanguagetập tin gán phạm vi source.jsvà variable.language.jsvới thistừ khóa. Vì Sublime Text 3 đang sử dụng .sublime-packageđịnh dạng tệp zip để lưu trữ tất cả các cài đặt mặc định nên việc chỉnh sửa các tệp riêng lẻ không đơn giản lắm.

Thật không may, không phải tất cả các chủ đề đều chứa tất cả các phạm vi, vì vậy bạn sẽ cần phải thử với các phạm vi khác nhau để tìm một chủ đề trông đẹp và cung cấp cho bạn điểm nổi bật mà bạn đang tìm kiếm. Có một số các chủ đề được bao gồm với Sublime Text, và nhiều hơn nữa có sẵn thông qua gói kiểm soát , mà tôi đánh giá cao đề nghị cài đặt nếu bạn chưa có. Đảm bảo bạn tuân theo hướng dẫn ST3 .

Khi nó xảy ra, tôi đã phát triển Neon Color Scheme, có sẵn thông qua Kiểm soát gói, mà bạn có thể muốn xem qua. Mục tiêu chính của tôi, bên cạnh việc cố gắng làm cho một loạt các ngôn ngữ trông đẹp nhất có thể, là xác định càng nhiều phạm vi khác nhau càng tốt - nhiều phạm vi khác được đưa vào các chủ đề tiêu chuẩn. Ví dụ, mặc dù định nghĩa ngôn ngữ JavaScript không kỹ lưỡng như Python, Neonnhưng vẫn có nhiều sự đa dạng hơn so với một số định nghĩa mặc định như Monokaihoặc Solarized.

Tôi nên lưu ý rằng tôi đã sử dụng Better JavaScriptđịnh nghĩa ngôn ngữ của @ int3h cho hình ảnh này thay vì định nghĩa ngôn ngữ đi kèm với Sublime. Nó có thể được cài đặt thông qua Kiểm soát gói.

CẬP NHẬT

Cuối cùng, tôi đã phát hiện ra một định nghĩa ngôn ngữ thay thế JavaScript khác - JavaScriptNext - ES6 Syntax. Nó có nhiều phạm vi hơn JavaScript cơ sở hoặc thậm chí là JavaScript tốt hơn. Nó trông giống như thế này trên cùng một mã:

Ngoài ra, kể từ khi tôi viết câu trả lời này ban đầu, @skuroda đã phát hành PackageResourceViewerthông qua Kiểm soát gói. Nó cho phép bạn xem, chỉnh sửa và / hoặc trích xuất các phần của hoặc toàn bộ .sublime-packagegói. Vì vậy, nếu chọn, bạn có thể chỉnh sửa trực tiếp các phối màu đi kèm với Sublime.

CẬP NHẬT KHÁC

Với việc phát hành gần như tất cả các gói mặc định trên Github , các thay đổi diễn ra nhanh chóng và dữ dội. Cú pháp JS cũ đã được viết lại hoàn toàn để bao gồm những phần tốt nhất của Cú pháp JavaScript Next ES6 và giờ đây hoàn toàn tương thích với ES6. Một tấn của các thay đổi khác đã được thực hiện để che góc và cạnh trường hợp, cải thiện tính nhất quán, và chỉ tổng thể làm cho nó tốt hơn. Cú pháp mới đã được đưa vào bản dựng 3111 mới nhất của nhà phát triển (tại thời điểm này) .

Nếu bạn muốn sử dụng bất kỳ cú pháp mới nào với bản dựng beta 3103 hiện tại , chỉ cần sao chép kho lưu trữ Github và liên kết JavaScript(hoặc bất kỳ (các) ngôn ngữ nào bạn muốn) vào Packagesthư mục của mình - tìm nó trên hệ thống của bạn bằng cách chọn Preferences -> Browse Packages.... Sau đó, chỉ cần thực hiện một git pulltrong thư mục repo gốc thỉnh thoảng để làm mới bất kỳ thay đổi nào và bạn có thể tận hưởng những gì mới nhất và tuyệt vời nhất! Tôi nên lưu ý rằng repo sử dụng .sublime-syntaxđịnh dạng mới thay vì định dạng cũ .tmLanguage, vì vậy chúng sẽ không hoạt động với các bản dựng ST3 trước năm 3084 hoặc với ST2 (trong cả hai trường hợp, bạn nên nâng cấp lên bản dựng beta hoặc nhà phát triển mới nhất).

Tôi hiện đang điều chỉnh Sơ đồ màu Neon của mình để xử lý tất cả các phạm vi mới trong cú pháp JS mới, nhưng hầu hết đã được đề cập.

Cuối cùng tôi đã tìm ra cách để tùy chỉnh các Chủ đề đã cho.

Đi tới C:\Program Files\Sublime Text 3\Packagesvà sao chép + đổi tên Color Scheme - Default.sublime-packagethành Color Scheme - Default.zip. Sau đó, giải nén nó và sao chép Chủ đề, bạn muốn thay đổi thành %APPDATA%\Sublime Text 3\Packages\User. (Trong trường hợp của tôi, All Hallow's Eve.tmTheme).

Sau đó, bạn có thể mở nó bằng bất kỳ Trình soạn thảo văn bản nào và thay đổi / thêm thứ gì đó, ví dụ như thay đổi thistrong JavaScript:

<dict>
    <key>name</key>
    <string>Lang Variable</string>
    <key>scope</key>
    <string>variable.language</string>
    <key>settings</key>
    <dict>
        <key>foreground</key>
        <string>#FF0000</string>
    </dict>
</dict>

Điều này sẽ đánh dấu thismàu đỏ trong Tệp JavaScript. Bạn có thể chọn Chủ đề của mình bên dưới Preferences -> Color Scheme -> User -> <Your Name>.

Sử dụng plugin PackageResourceViewer được cài đặt qua Package Control (như MattDMo đã đề cập ). Điều này cho phép bạn ghi đè các tài nguyên đã nén bằng cách chỉ cần mở nó trong Sublime Text và lưu tệp. Nó chỉ tự động lưu các tài nguyên đã chỉnh sửa vào% APPDATA% / Roaming / Sublime Text 3 / Packages / hoặc ~ / .config / sublime-text-3 / Packages /.

Cụ thể đối với op, sau khi plugin được cài đặt, hãy thực thi PackageResourceViewer: Open Resourcelệnh. Sau đó chọn JavaScripttiếp theo là JavaScript.tmLanguage. Thao tác này sẽ mở tệp xml trong trình chỉnh sửa. Bạn có thể chỉnh sửa bất kỳ định nghĩa ngôn ngữ nào và lưu tệp. Thao tác này sẽ ghi một bản sao ghi đè của tệp JavaScript.tmLanguage trong thư mục người dùng.

Phương pháp tương tự có thể được sử dụng để chỉnh sửa định nghĩa ngôn ngữ của bất kỳ ngôn ngữ nào trong hệ thống.

"Cái này" đã được tô màu trong Javascript.

Xem-> Cú pháp-> và chọn ngôn ngữ của bạn để đánh dấu.

Đây là công thức của tôi

Lưu ý: Đây không phải là chính xác những gì OP đang yêu cầu. Các hướng dẫn này sẽ giúp bạn thay đổi màu sắc của các mục (nhận xét, từ khóa, v.v.) được xác định theo quy tắc đối sánh cú pháp. Ví dụ: sử dụng các hướng dẫn này để thay đổi sao cho tất cả các chú thích mã có màu xanh lam thay vì xanh lục.

Tôi tin rằng OP đang hỏi cách xác định thislà một mục được tô màu khi được tìm thấy trong tệp nguồn JavaScript.

1. Gói cài đặt: PackageResourceViewer

2. Ctrl+Shift+P> [ PackageResourceViewer: Open Resource]> [ Color Scheme - Default]> [ Marina.sublime-color-scheme] (hoặc bất kỳ cách phối màu nào bạn sử dụng)

3. Lệnh trên sẽ mở một tab mới cho tệp " Marina.sublime-color-scheme".

   • Đối với tôi, tệp này nằm trong hồ sơ chuyển vùng của tôi %appdata%( C:\Users\walter\AppData\Roaming\Sublime Text 3\Packages\Color Scheme - Default\).
   • Tuy nhiên, nếu tôi duyệt đến đường dẫn đó trong Windows Explorer , [ Color Scheme - Default] không phải là con của [ Packages] dir. Tôi nghi ngờ rằng PackageResourceViewerđang thực hiện một số ảo hóa.

bước tùy chọn: Trên tab phối màu mới: Ctrl+Shift+P> [ Set Syntax: JSON]

4. Tìm kiếm quy tắc bạn muốn thay đổi. Tôi muốn làm cho các nhận xét được hiển thị, vì vậy tôi đã tìm kiếm " Comment"

   • Tôi đã tìm thấy nó trong "rules"phần

 "rules":
    [
        {
            "name": "Comment",
            "scope": "comment, punctuation.definition.comment",
            "foreground": "var(blue6)"
        },

5. Tìm kiếm chuỗi "blue6":để tìm phần định nghĩa biến màu. Tôi đã tìm thấy nó trong "variables"phần.

6. Chọn màu mới bằng công cụ như http://hslpicker.com/ .

7. Xác định một biến màu mới hoặc ghi đè cài đặt màu cho blue6.

   • Cảnh báo: ghi đè blue6sẽ ảnh hưởng đến tất cả các phần tử văn bản khác trong bảng màu đó cũng sử dụng blue6 ("Dấu câu" "Accessor").

8. Lưu tệp của bạn, các thay đổi sẽ được áp dụng ngay lập tức cho bất kỳ tệp / tab nào đang mở.

LƯU Ý

Sublime sẽ xử lý bất kỳ kiểu màu nào trong số này. Có thể nhiều hơn nữa.

hsla = hue, saturation, light, alpha rgba = red, green, blue, alpha

hsla (151, 100%, 41%, 1) - tham số cuối cùng là mức alpha (độ trong suốt) 1 = không trong suốt, 0,5 = nửa trong suốt, 0 = toàn trong suốt

hsl (151, 100%, 41%) - không có kênh alpha

rgba (0, 209, 108, 1) - rgb với kênh alpha

rgb (0, 209, 108) - không có kênh alpha