emmentでimgなどを打つとclass属性最後になってしまいます。 普通は始めですよね？

Question

emmentでimgなどを打つとclass属性最後になってしまいます。
普通は始めですよね？

変更する方法なんてあるのでしょうか？

デフォルトで追加されるすべての属性を自分で書いてあげればその順番になるのでしょうか？

海外の人が同じ問題が公式で報告していますが、スルーされているのでしょうがないと思うしかないでしょうか。
https://github.com/emmetio/emmet/issues/331

Answer 1

変更は可能だと思います。
emmetの設定ファイルがあると思うので、それをいじる感じです。
自分が使っているBracketsの例→BracketsのEmmetをカスタマイズしてより使いやすくする

「使っているエディタ+emmet+カスタマイズ」とかで検索するといいと思います。

Comments

[退会済みユーザー]

リンク先を見たのですがブラケットでの変更がいろいろ記載してありますが、
自動コメントなどだけの記載でした。

サブライム3でも設定はさほど変わらないのですかね。

[gin]

例はあくまで例です。
要するにカスタマイズは可能だということです。
検索はしてみましたか？
例えばBracketsであれば、こういう記述「"img": "<img src=\"\" alt=\"\" />",」があるので「"img": "<img class=\"\" src=\"\" alt=\"\" />",」と変えればいいのです。

[gin]

「/ユーザー/AppData/Roaming/Sublime Text 2/Packages/Emmet/emmet/snippets.json」
↑これSL2(win)のですけどこんな感じのところにjsonファイルがあるので開いて修正してみてはどうでしょう。

[退会済みユーザー]

ありがとうございます。

win１０ですが下記にemmentというフォルダが見つかりませんでした。
ColorPickerなどはあるのですが、
C:\Users\user\AppData\Roaming\Sublime Text 3\Packages

[gin]

試しに自分のPCでSL3インストールしてみましたが…
ないですねｗ

というわけで、自分でカスタマイズしましょう。

Preferences ＞ Package Settings ＞ Emmet ＞ Settings - User
で以下のような感じで追加。
-------
{
"snippets": {
"html": {
"snippets": {
"img": "<img class=\"\" src=\"\" alt=\"\">"
}
}
}
}
-------
SL3を立ち上げなおせばOKです。
「img」で確かめてみましたがちゃんと上記のように出力されました。

[退会済みユーザー]

ありがとうございます。
追加してみます。

[退会済みユーザー]

できましたありがとうございます。

ただもともとあった記載を削除しないとエラーが出る問題が今度は起きてしまいました。

もともとあった記述
{
"snippets": {
"html": {
"filters": "html,c",
"snippets": {
"@sp": "@media (min-width: 34em)",
"@pc": "@media (min-width: 48em)",
"@biggest": "@media (min-width: 75em)"
}
}
}

・下記のようにすると添付ファイルのエラーが出ます。
{
"snippets": {
"html": {
"snippets": {
"img": "<img class=\"\" src=\"\" alt=\"\">"
}
}
}
}

{
"snippets": {
"html": {
"filters": "html,c",
"snippets": {
"@sp": "@media (min-width: 34em)",
"@pc": "@media (min-width: 48em)",
"@biggest": "@media (min-width: 75em)"
}
}
}

[gin]

普通に追加でよくないです？
-------
{
"snippets": {
"html": {
"filters": "html,c",
"snippets": {
"img": "<img class=\"\" src=\"\" alt=\"\">",
"@sp": "@media (min-width: 34em)",
"@pc": "@media (min-width: 48em)",
"@biggest": "@media (min-width: 75em)"
}
}
}
-------
カンマを忘れずに。

[退会済みユーザー]

新しいのを作るたびに

{
"snippets": {
"html": {
"filters": "html,c",
"snippets": {

}
}
}
を記載しないでカンマでいくらでも追加できるのですね。
また上記の記載はいっかいしかできないのでエラーが出たということなのでしょうね。

[gin]

↑のセットもカンマ区切りで並べられるかも知れませんが、並べても無意味どころか見づらくなるだけなので最小限の「"test": "test_text",」みたいなものを追加がよいかと思います。

[退会済みユーザー]

emment　setting　書き方

で検索したのですが、記載の仕方が出てきません。cssやjsも追加したいのですが、
できませんでした。
記載の仕方がわかりやすいサイトなどご存知ないでしょうか？

[gin]

↑の質問と変わってきてるのでここに追加より新しく立ててほしいものですが。
とりあえずJSは聞いたことありません。
CSSはhtmlと同列に作れば追加できます。
ここでは以上で。

[退会済みユーザー]

https://teratail.com/questions/52301?modal=q-comp
に再質問します。

よろしくお願い申し上げます。