はてなブックマーク

弊社内でgulp派が増えてきたので、そろそろ重い腰をあげてgulpfileを書いた。 spriteは、西畑さんの記事を参考にしている。 cultを使用しているため、あらかじめグローバルにインストールしておく必要がある。 sudo npm i -g gulp cultpackage.json { "name": "demo", "version": "1.0.0", "description": "demo", "author": "tomoki kubo", "dependencies": {}, "devDependencies": { "gulp-load-plugins": "^0.5.1", "gulp": "^3.6.2", "gulp-autoprefixer": "0.0.7", "coffee-script": "^1.7.1", "gulp-stylus": "^1.0.

ブログに書こうと思ったけど、整形するのがめんどくなったので、骨組みを書き殴っておく。 「Layer Exporter」は、Photoshop CCの画像アセットのようにレイヤーに名前を付けるだけで画像の書き出しを行う、Illustratorのエクステンションです。 JPEG, PNG, SVGの形式で画像の書き出しが行えます。 インストールAdobe Exchange PanelのインストールLayer Exporterを利用するには、まず「Adobe Exchange Panel」をインストールします。 Download the Adobe Exchange Panelページの上部にある「Download」ボタンをクリックし、使っているIllustratorのバージョンを選びます。(CCとCS6のみ) ダウンロードしたファイルを実行し、「Adobe Exchange Panel」をインス

background: url(#{$root}/img.jpg); とすることで、ディレクトリを何回も書かなくてもいい。 というのを、最近見かけたが、インターポレーション付で$rootなんて、いちいち書くの面倒くさい。 「コピペでええやん」という声もありそうだが、それなら変数にせずに、ディレクトリをそのままコピペしてもいいし、あとから変更を加えたいなら、一括置換で問題ないのではないだろうか。 ただ、ディレクトリをコピペするのも面倒くさいので、url()をfunctionでオーバーライドできないか、やってみたところ、できたのでソースを載せておく。 SCSS @function url($imgName) { @return url(dir/#{$imgName}); } .test { background: url("img.jpg"); background: url(img.jpg)