web-dev-qa-db-ja.com

Sublime Text 2のSassサポート?

Sass in Sublime Text 2を編集するための既存のパッケージはありますか?

これは人気があるようです: https://github.com/n00ge/sublime-text-haml-sass

ただし、インストール後は、scssファイルの構文強調表示のみを提供するようです。

理想的には、sass構文の構文の強調表示、インデント、および補完が必要です。

67
user1419762

私はあなたがこの1つと一緒に行くことをお勧めします: https://github.com/nathos/sass-textmate-bundle 、驚くべきコード補完のためだけに-SASS /と互換性がありますSCSS。

パッケージについて疑問がある場合、および驚くべきSublime Package Control を使用する場合は、 packages listtype何か (結果はインストール数でソートされます)、通常最も人気のあるものが最良です1。

70
Maxime Fabre

Scssファイルに対してのみ機能する理由は、Ruby HAML強調表示設定がsass強調表示をオーバーライドするためです。

ジャンプPreferences> Browse Packages...

Railsフォルダー内のRuby Haml.tmLanguageを見つけて開きます

fileTypesを次から変更します。

<?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>
...

に:

<?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>
...

これで、インストールしたSASS強調表示パッケージが正常に機能するはずです。

46

このことについて最近ブログ投稿をしました: SASSサポートをSublime Textに追加する方法

以下に簡単な要約を示します。

  • 構文の強調表示を取得するには、パッケージコントロールで単にSassと呼ばれる sass-textmate-bundleプラグイン をインストールします。 sassファイルはデフォルトでは適切にハイライトされないことがわかりますが、投稿ではSublimeのデフォルトプラグインのハッキングを伴わない2秒間の修正について詳しく説明しています。
  • SASS Build plugin をインストールして、Sublimeからのsassおよびscssファイルのビルドを有効にします。
  • SublimeOnSaveBuildプラグイン を追加します。これは、ファイルに変更を保存するたびに自動的にビルドを実行します。

詳細については、 ブログ投稿 をご覧ください。

21
Josh Earl

この記事 に関して:

  1. sass-textmate-bundleプラグインをインストールします
  2. いくつかのsassファイルを開きます
  3. クリック表示| 構文| 現在の拡張子ですべて開く…| Sass
18
blackbiron

パッケージの競合が問題を引き起こしている場合(Hamlの問題など)、<string>sass</string>部分をRuby HAMLファイルから削除するなど、パッケージを編集/オーバーライドする必要がある場合は、強​​くお勧めしますパッケージリソースビューア(およびエディタ) プラグイン。

  1. PackageResourceViewerをインストールします
  2. パレットを使用してPackageResourceViewer: Open Resourceを実行します。

    http://img33.imageshack.us/img33/9186/ozek.png

  3. Railsを選択してからRuby Haml.tmLanguageを選択します。

    screen-2014-02-25_10.37.09.png http://img208.imageshack.us/img208/116/slnn.png
  4. 問題のある行をコメントアウトします。

    screen-2014-02-25_10.39.12.png http://img163.imageshack.us/img163/7060/axa8.png

  5. ファイルを保存します(PackageResourceViewerは上書きされた部分だけを自動的に正しい場所に自動的に保存するため、これは素晴らしい部分です。

  6. できた.

さあ、いらいらした他のパッケージの小さな設定/デフォルトをすべて微調整してください。

3
cwd

私は https://github.com/n00ge/sublime-text-haml-sass がRails余分な_.css.sass_拡張のため、デフォルトの_.css_ファイル。 https://github.com/seaofclouds/sass-textmateを使用して、上記のMaximeに同意します-bundle はより優れたオプションであり、パッケージコントロールを介したインストールが理想的です http://wbond.net/sublime_packages/package_control 。css.sass拡張子が認識されないのを修正する方法は、Sassパッケージを直接編集することです_Sublime Text 2 > Preferences > Browse Packages_に移動し、_Sass\Syntaxes\Sass.tmLanguage_ファイルを編集します。_<string>css.sass</string>_を_<array>_ブロック。

_<key>fileTypes</key>
<array>
  <string>sass</string>
  <string>css.sass</string>
  <string>scss</string>
</array>
_
2
user1159653