Qiita Teams that are logged in
You are not logged in to any team

Log in to Qiita Team
Community
OrganizationAdvent CalendarQiitadon (β)
Service
Qiita JobsQiita ZineQiita Blog
13
Help us understand the problem. What is going on with this article?
@t-hiroyoshi

Atomのパッケージにスニペット機能を追加する方法

More than 5 years have passed since last update.

パッケージ新規作成で作成したAtomパッケージにスニペット機能を追加する

新規作成されたパッケージの構成

Generate Packageで生成されたパッケージの雛形の構成は下記のようになっています。このままではスニペット用のフォルダは存在していません。ちなみにこれらのフォルダやファイルはそれぞれざっくり言うと下記の様な役割を持っています。

この他にスニペットを登録可能なsnippetsや文法を定義してシンタックスハイライト可能なgrammarsが追加可能です。

test-package
├── CHANGELOG.md        -- チェンジログ
├── LICENSE.md          -- ライセンス
├── README.md                -- 説明書
├── keymaps/                 -- パッッケージのキーマップ
├── lib/                     -- その他多くの機能
├── menus/                   -- メニュー表示系
├── package.json             -- パッケージの情報
├── spec/                    -- パッケージのテスト
└── styles/                  -- パッケージのスタイルシート

スニペットの作成

スニペットについて書いているファイルはsnippets内に置く必要があるのでフォルダを作りその中にjsonまたはcson形式でスニペットを書いていきます。
今回はcsonでやってみたいと思うのでfoo.csonを作成したsnippets内に作ります。

test-package
├── CHANGELOG.md
├── LICENSE.md
├── README.md
├── keymaps
├── lib
├── menus
├── package.json
├── snippets                     -- 各自作成する
│   └──foo.cson もしくは foo.json   -- ここに色々書く
├── spec
└── styles

作成したfoo.csonには以下のように登録したいスニペットを書いていきます。今回は3種類のスニペットを登録します。

foo.cson
'.source.gfm':
  'foo' :
    'prefix' : 'bar'
    'body' : 'baz'
  'link url' :
    'prefix' : 'url'
    'body' : '[${1: title}](${2: URL})'
  'code box' :
    'prefix' : 'code'
    'body' : """
      ```
      ${1: code}
      ```
    """

.source.gfmはスニペットを有効にするセレクタを指定していて今回はMarkdownを指定しています。

fooはスニペット名を意味していてbarはスニペットを展開する時に使用するキー、bazは展開される本文を意味しています。

スニペット本文内に${1: tittle}${2: URL}と埋め込むことでtabによるカーソル移動の順番も設定できます。

スニペット本文は複数行展開にも対応していて本文を"""で囲むことにより展開可能になります。

Atomを再起動すればこれらのスニペットが有効になっていると思います、手軽に実装できるので是非試してみてください。

13
Help us understand the problem. What is going on with this article?
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
t-hiroyoshi
Co-founder&CTO of Shinonome, inc.
shinonomeinc
東京理科大学発ベンチャー。提携大学内にソフトウェア研究所を組織し、学生向けのTech教育を提供しています。

Comments

No comments
Sign up for free and join this conversation.
Sign Up
If you already have a Qiita account Login
13
Help us understand the problem. What is going on with this article?