Hỗ trợ Sass cho Sublime Text 2?

Question

Có gói hiện tại để chỉnh sửa Sass trong Sublime Text 2 không?

này có vẻ là phổ biến: https://github.com/n00ge/sublime-text-haml-sass

Tuy nhiên, sau khi cài đặt, có vẻ như nó chỉ cung cấp cú pháp tô sáng cho scss tập tin.

Lý tưởng nhất, tôi muốn đánh dấu cú pháp, thụt lề và hoàn thành cú pháp cho cú pháp sass.

Answer 1

Tôi khuyên bạn nên sử dụng phần này: https://github.com/nathos/sass-textmate-bundle, nếu chỉ để hoàn thành mã tuyệt vời - tương thích với SASS/SCSS.

Bất cứ khi nào nghi ngờ về gói và giả sử bạn sử dụng Sublime Package Control tuyệt vời, chỉ cần sử dụng packages list, type something (kết quả sẽ được sắp xếp theo số lượt cài đặt) và thường là phiên bản phổ biến nhất.

Answer 2

Lý do nó chỉ hoạt động đối với tệp scss của bạn là vì cài đặt làm nổi bật của Ruby HAML ghi đè lên phần tô sáng sass của bạn.

Chuyển đến Preferences>Browse Packages...

Tìm và mở Ruby Haml.tmLanguage bên trong thay đổi Rails thư mục

các loại file từ:

<?xml version="1.0" encoding="UTF-8"?> 
<!DOCTYPE plist PUBLIC "-//Apple Computer//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd"> 
<plist version="1.0"> 
<dict> 
    <key>fileTypes</key> 
    <array> 
     <string>haml</string> 
     <string>sass</string> <!-- This line is causing the problem --> 
    </array> 
    <key>foldingStartMarker</key> 
    <string>^\s*([-%#\:\.\w\=].*)\s$</string> 
    <key>foldingStopMarker</key> 
    <string>^\s*$</string> 
... 

tới:

<?xml version="1.0" encoding="UTF-8"?> 
<!DOCTYPE plist PUBLIC "-//Apple Computer//DTD PLIST 1.0//EN" "http://www.apple.com/DTDs/PropertyList-1.0.dtd"> 
<plist version="1.0"> 
<dict> 
    <key>fileTypes</key> 
    <array> 
     <string>haml</string> 
    </array> 
    <key>foldingStartMarker</key> 
    <string>^\s*([-%#\:\.\w\=].*)\s$</string> 
    <key>foldingStopMarker</key> 
    <string>^\s*$</string> 
... 

Bây giờ Sass nổi bật gói bạn đã cài đặt sẽ hoạt động bình thường.

Answer 3

Tôi gặp sự cố https://github.com/n00ge/sublime-text-haml-sass không nhận dạng Rails mặc định .css.sass tệp vì tiện ích mở rộng thêm .css. Tôi đồng ý với Maxime ở trên sử dụng https://github.com/seaofclouds/sass-textmate-bundle là một lựa chọn tốt hơn và cài đặt thông qua điều khiển gói là lý tưởng http://wbond.net/sublime_packages/package_control. Cách khắc phục phần mở rộng .css.sass không được nhận dạng là chỉnh sửa trực tiếp gói Sass. Truy cập Sublime Text 2 > Preferences > Browse Packages và chỉnh sửa tệp Sass\Syntaxes\Sass.tmLanguage. Thêm <string>css.sass</string> vào khối <array>.

<key>fileTypes</key> 
<array> 
    <string>sass</string> 
    <string>css.sass</string> 
    <string>scss</string> 
</array> 

Answer 4

Gần đây, tôi đã đăng một bài đăng blog về điều này: How to Add SASS Support to Sublime Text.

Dưới đây là một bản tóm tắt nhanh chóng:

• Để làm nổi bật cú pháp, cài đặt sass-textmate-bundle plugin, được gọi đơn giản là Sass trong Control Package. Bạn sẽ thấy rằng các tệp sass sẽ không được đánh dấu đúng theo mặc định, nhưng trong bài đăng tôi nêu chi tiết cách khắc phục hai giây không liên quan đến việc hack bất kỳ plugin mặc định nào của Sublime.
• Cài đặt SASS Build plugin để bật các tệp sass và scss từ Cao nguyên.
• Thêm SublimeOnSaveBuild plugin, công cụ này sẽ tự động chạy một công trình bất cứ khi nào bạn lưu thay đổi vào tệp.

Khám phá blog post để biết chi tiết đầy đủ.

Answer 5

liên quan đến this article:

1. cài đặt sass-textmate-bó Plugin
2. mở một số tập tin sass
3. nhấp chuột Xem | Cú pháp | Mở tất cả bằng tiện ích mở rộng hiện tại là… | Sass

Answer 6

Nếu một cuộc xung đột gói đang gây rắc rối (như vấn đề Haml) và bạn cần phải chỉnh sửa/ghi đè lên một gói giống như loại bỏ phần <string>sass</string> từ tập tin Ruby HAML, sau đó tôi sẽ khuyên các Package Resource Viewer (and editor) cắm vào.

1. Install PackageResourceViewer
2. Sử dụng bảng để làm PackageResourceViewer: Open Resource:
   
   http://img33.imageshack.us/img33/9186/ozek.png
   
   
3. Chọn Rails sau đó Ruby Haml.tmLanguage:
   
   screen-2014-02-25_10.37.09.png http://img208.imageshack.us/img208/116/slnn.png
4. Comment ra dòng vi phạm:
   
   screen-2014-02-25_10.39.12.png http://img163.imageshack.us/img163/7060/axa8.png
   
   

5. Lưu tệp (đây là phần tuyệt vời, vì PackageResourceViewer sẽ tự động lưu chỉ phần được ghi đè tự động vào đúng vị trí.

6. Xong.

Bây giờ, hãy tinh chỉnh tất cả các cài đặt/mặc định trong các gói khác khiến bạn khó chịu.