1
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

Sublime Text 3でHayakuを使っているとSCSSのスニペットが使えない問題

Last updated at Posted at 2017-10-19

Sublime TextでSassコーディングするときはHayakuを使っています。楽すぎてもう手放せません。
でもたまに理想通りに展開してくれなかったり、よく使うmixinなどもスパパッと入力したかったりしたのでスニペットを登録することにしました。

##️ スニペット動かない問題
ドキュメンテーションに沿ってスニペットを登録しても動作してくれません。ググるとスコープが間違ってるパターンが多いようでしたが今回は当てはまらないようです。
ちなみにスニペットを使いたいソース中で command+option+P するとスコープを確認できます。

ダメだった例

@at-root.sublime-snippet
<snippet>
  <content><![CDATA[
@at-root {
  $1
}
]]></content>
  <!-- Optional: Set a tabTrigger to define how to trigger the snippet -->
  <tabTrigger>ar</tabTrigger>
  <!-- Optional: Set a scope to limit where the snippet will trigger -->
  <scope>source.scss</scope>
</snippet>

解決策

stack overflowで同様の問題を見つけました
それによるとHayakuとコンフリクトしているのではないかということでした。なので tabTrigger の最後にスラッシュ / を付け加えたところ動いてくれました!:tada::clap_tone1:

成功した例

@at-root.sublime-snippet
<snippet>
  <content><![CDATA[
@at-root {
  $1
}
]]></content>
  <!-- Optional: Set a tabTrigger to define how to trigger the snippet -->
  <tabTrigger>ar/</tabTrigger>
  <!-- Optional: Set a scope to limit where the snippet will trigger -->
  <scope>source.scss</scope>
</snippet>

これで思う存分スニペットを登録できます。
SCSS-Snippetsも入れてましたが @for のスニペットなど使えてなかったのでこの方法で再登録しました。

1
2
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?