「Sublime Text 3」で【Emmet(エメット)】を導入する方法・手順をわかりやすく解説！

みなさんこんにちは！おさかなです！

今回は「「Sublime Text 3」で【Emmet(エメット)】を導入する方法」について、書いていこうと思います！

それでは、レッツゴー！！！！！

はじめに

今回は、「Sublime text 3」というエディタにEmmet(エメット)導入していきます！
「まだ、パソコンに入ってないよ…。」
という方は下の記事から準備してみてね✨

【Sublime Text 3】の「ダウンロード」&「インストール」方法・手順について！わかいりやすく解説！

みなさんこんにちは！おさかなです！ 今回は「【Sublime Text 3】の「ダウンロード」&「インストール」方法」について、書いていこうと思います！ それでは、レッツゴー！！！！！ 想定読者 ・テキストエディタを...

osakanav.com

2020.02.02

おさかな

順番通りにやっていけば大丈夫だよ！
焦らずゆっくりね！

事前準備！「Packege Control」を導入していこう！

まず、「Sublime Text 3」に機能を追加していくためのプラグインである「Packege Control」を導入していきます！

まずは、下記コードを「コピー」します！

import urllib.request,os,hashlib; h = '7183a2d3e96f11eeadd761d777e62404' + 'e330c659d4bb41d3bdf022e94cab3cd0'; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(); urllib.request.install_opener( urllib.request.build_opener( urllib.request.ProxyHandler()) ); by = urllib.request.urlopen( 'http://packagecontrol.io/' + pf.replace(' ', '%20')).read(); dh = hashlib.sha256(by).hexdigest(); print('Error validating download (got %s instead of %s), please try manual install' % (dh, h)) if dh != h else open(os.path.join( ipp, pf), 'wb' ).write(by)

次に「Sublime Text 3」を開いて、「View」>「Show Console」を選択します。
(または、ショートカットキー「ctrl」＋「`」)

すると、このような画面が表示されます…！

この画面の「テキストボックス」の中に、先ほどコピーしたコードを「貼り付け」て「Enter」を押します…！

これで、事前準備は完了です…！
(Emmet(エメット)が使えるまであともう少し！)

Emmet(エメット)を導入していこう！

それでは、早速Emmet(エメット)を導入していきましょう～！

まず、「Tool」＞「Command Palette」を選択して「コマンドパレット」を開きます。
(または、ショートカットキー「Ctrl」+ 「Shift」+「P」)

すると、このような検索ボックスが表示されるので、「Packege Control:Install Packege」と入力します…！

実際につかってみよう！

それでは、実際に「Emmet(エメット)」が使用できるようになったかどうか、チェックしていきましょう！

まず新しくファイルを開いて、右下の「言語設定」を「HTML」に変更します…！

右下に「HTML」と表示されていれば、OKです！

そして、ファイルの中に

html:5

と入力して「Tab(タブキー)」を押すと…。

こんな感じで！HTMLのひな型が一瞬で表示されました！(やった～！)

感想・まとめ

今回は「「Sublime Text 3」で【Emmet(エメット)】を導入する方法」について、書いていきました…！

いかがだったでしょうか？

最初は「Emmet(エメット)」に慣れず、難しいと感じてしまうかもしれませんが、慣れると本当にスピーディーにコーディングすることができるので、がんばって使ってみてください…！

おさかなも、もうEmmet(エメット)なしの生活には戻れません！笑

ぜひ！積極的にチャレンジしてみてください…！(応援しています！)

おさかなびではプログラミング学習中の人、ブログ初心者に向けて、「デジタル時代を楽しむためのミニ知識」をご紹介しています！
ぜひ他のページも覗いてみてください…！

それでは今回はこの辺で！

ここまで読んでくださり、ありがとうございました！

おさかなでした！