「HTML5」カテゴリーアーカイブ

HTML関連

PHPStorm,Bower,Gulpを使ったHTMLコーディング環境設定メモ(超個人的、小規模サイト用、sass記法)

コメントを残す

PHPStorm,Bower,Gulpを使ったHTMLコーディング環境設定メモ(超個人的、小規模サイト用、sass記法)

個人的にライトに使っているgulpの使い方メモ
小規模〜中規模のWebコーディング、システム開発をメインにしています。
(以下 HomeBrewはインストール済を想定)

続きを読む →

PHPStorm(WebStorm)でのSCSS/Compassの自動コンパイル設定(Mac OS EI Capitan)

コメントを残す

メニューの[Prefrerence]からパネルを開く。

コンパスの有効化

File Watchersの設定(変更があった場合に自動コンパイルするファイルタイプ関連の設定)

(scss)

(sass)

Program : /usr/local/bin/compass
Arguments : compile
Working directory : $FileDir$
Environment variables : (空)
Output paths to refresh : $FileParentDir$/css/$FileNameWithoutExtension$.css

※追記 : sassファイルが多くなって更新時に編集中のファイルのみをコンパイルしたい場合は、Arguments : compile $FileName$ と指定すると良いです。

PHPStormでつかってますが、コードヒントが出てくれて便利です。@includeで一覧したり、

先頭数文字タイプすると候補が絞込まれて、その引数も見れたり

さらに @includeで書いたmixinの部分を Cmd+クリックで compassのソース(mixin)が見れたり。

なかなか便利、wordpressなどの関数も数文字タイプで候補に上がったりで便利すぎて
手放せない開発環境になっています。
(Atom,Sublime,Aptanaとかもどうなのか時間があれば調べてみたいがなかなか><)

Monaca/OnsenUI：Ajax通信中にモーダルを表示を数行で簡単に実装しました。

コメントを残す

ons.ready(function() {
	
	var $modal = $('');
	$('body').append($modal);
	ons.compile($modal[0]);
	//$modal.css('background-color','rgba(255,255,255,0.7)'); //モーダルを白に変更
	$.ajaxSetup({
		beforeSend:function(){
			myModal.show();
		},
		complete:function(){
			myModal.hide();
		}
	});
});