webstorm(51)

51follower
@iwasaki さんのアバター 27views

HomebrewでインストールしたJetBrains IDEに対してsecurity updateに対応する方法

JetBrains IDE(PhpStorm、WebStorm等)にセキュリティアップデートがアナウンスされました。 http://blog.jetbrains.com/blog/2016/05/11/security-update-fo... 2016年5月12日
harada さんのアバター 349views

Gruntで複数ディレクトリのSassを管理する

1つのGruntfile.jsで複数の別ディレクトリのSassを管理したい場合のGruntfile記述メモです。 config.rbファイルはディレクトリ分必要です。 構成例 /gruntfile.js /config.rb /comm... 2015年8月19日
Yukimi Sato さんのアバター 7views

【WebStorm】Navigate Class でクラスが記述してあるファイルを開く

commend + o ファイルを開かなくても記載があるファイルが調べられるので便利です。 ... 2015年6月2日
harada さんのアバター 31views

[Emmet]要素を接続する基本の記号

入れ子にして記述する 一番使うことが多そうです。 .clearfix>.floatLeft ↓タブで展開する <div class="clearfix"> <div class="floatLeft"&g... 2015年5月29日
harada さんのアバター 88views

[PhpStorm/WebStorm] EmmetのCSSでよく利用するショートコード

EmmetのCSSでよく利用するショートコードです。 position は pos pos:absolute ↓タブで展開する position: absolute; border は bd borderはbdと記述し、それな... 2015年5月28日
harada さんのアバター 54views

[PhpStorm/WebStorm] Emmet記法でCSSを記述する

EmmetではCSSも記述することができたのですね。 ショートコードというそうで、以前ご紹介したhttp://docs.emmet.io/cheat-sheet/こちらのチートシートに記述されています。 かなり数が多いので、覚えるのは難し... 2015年5月27日
Yukimi Sato さんのアバター 20views

【WebStorm】クラス名を一括で変更する

変更したいクラスを選択した状態で、 shift + F6 renameウィンドウがポップアップで開き、名前を変更するとプロジェクト内のファイルに記載されているクラス名が全て差し替わります。 便利ですが、便利すぎてちょっと怖い機能でもあ... 2015年5月25日
Yukimi Sato さんのアバター 14views

【WebStorm】WebStorm内で使用できるアクションを検索するショートカット

command + shift + a アクションのショートカットも横に表示されるので、「あれなんだっけな…」とド忘れした時に重宝しています。 ... 2015年5月22日
harada さんのアバター 46views

[PhpStorm/WebStorm] Emmet記法で簡単にナンバリングしたダミー要素を生成する

Emmet記法では$を利用することで、自動でナンバリングすることができます。 draggableというclassのdivに囲まれた要素を10個作ってナンバリングさせる .draggable{テスト$}*10 ↓ [Tab]で変換 ... 2015年5月21日
Yukimi Sato さんのアバター 37views

【WebStorm】単語やブロックで選択できるショートカット

WebStormは便利なのですが選択がどうも使いにくく、マウスで選択すると開始タグが壊れた状態でコピーしてしまったりすることも多々有ります。 それを防ぐためにも下記ショートカットを使って単語やブロック単位で選択するのがオススメです。 al... 2015年5月19日
Yukimi Sato さんのアバター 27views

【WebStorm】プロジェクト内の全てのファイルから検索する

通常のファイル内検索はcommand+Fですが、プロジェクト内から検索をかけたいときには command + shift + F で検索用のウィンドウが開き検索します。 Scopeを「Whole project」にすれば現在開いてい... 2015年5月18日
Yukimi Sato さんのアバター 31views

【WebStorm】クラスやIDがどこで使用されているのか調べる

調べたいクラスまたはIDをダブルクリックで選択した後に下記ショートカットを実行します。 alt + F7 プロジェクト内を検索してHTMLやCSS、JSで使用されているところを表示してくれます。 CSSはすぐに肥大化してしまうので気に... 2015年5月15日
Yukimi Sato さんのアバター 10views

【WebStorm】短形選択を使用する

command + shift + 8 上記ショートカットで短形選択を使用することができます。 元の普通の選択方法に戻したいときはもう一度ショートカットを実行すると切り替わります。 ... 2015年5月14日
Yukimi Sato さんのアバター 21views

【WebStorm】最近修正したファイル一覧を開く

最近修正した直近20件のファイル一覧を command + shift + e で開くことができます。 tab表示で開きっぱなしもできますが、このショートカットを使えば慣れるとすぐに確認できます。また、似たような名前のファイルをいじっている... 2015年5月13日
Yukimi Sato さんのアバター 80views

【WebStorm】一括でコメントアウト(//)させるショートカット

command + / Windowsは Ctrl + / でできます。 SCSSなど一括でコメントアウトしたいときに便利です。 ... 2015年5月12日
harada さんのアバター 222views

[PhpStorm/WebStorm] Emmet記法で複数classを指定する

Emmet記法で1つの要素に複数のclassを指定するのはどうすればいいのかなと思ったら、なんのことはなく、.classを複数書いていけばいいだけでした。 pタグにclass1 class2の2つのclassを指定したい場合 p.cla... 2015年5月11日
Yukimi Sato さんのアバター 53views

【WebStorm】クリップボード履歴を開く

一回前にコピーしたものをもう一度ペーストしたい!なんて時に便利です。 command + shift + V これでクリップボード履歴を開くことができます。 ... 2015年5月11日
Yukimi Sato さんのアバター 34views

【WebStorm】コードBookmark機能を使う

WebStormにはコードBookmark機能があります。 現在修正した箇所や、追加した箇所にBookmarkすることで時間が経過しても簡単に探すことができます。 Bookmarkをつける Bookmarkをしたい行を選択します。 a... 2015年5月8日
harada さんのアバター 13views

[PhpStorm/WebStorm] コードをグルーピングして繰り返したい箇所を指定する

たとえばチェックボックスを複数個作成したい場合に、Emmet記法で下のように普通に記述してしまうと、生成される内容がちがくなってしまいます。 label>input[type="checkbox"]*3 ↓ [Tab]で変換 ... 2015年5月1日
harada さんのアバター 136views

[PhpStorm/WebStorm] Git上のファイルとローカルで開いているファイルを比較する

Githubで同期させているファイルの場合、WebStorm/PhpStorm上のファイル名の上で右クリックをするとメニューの中に「Git」という項目があります。 ここから「Compare with the same repository... 2015年4月17日