※gulp-ejsでのビルドを想定しています。 EJSでできること 数や文字列や配列やオブジェクトの宣言と処理(JavaScriptと同じ) HTMLへの値の展開 ループと条件分岐 外部ファイルの読み込みとパラメータの引き渡し <% %>の種類 <% %> このタグの内側はJavaScriptワールドになる。HTMLとしては出力されない
テンプレートエンジンEJSで使える便利な構文まとめ - Qiita
※gulp-ejsでのビルドを想定しています。 EJSでできること 数や文字列や配列やオブジェクトの宣言と処理(JavaScriptと同じ) HTMLへの値の展開 ループと条件分岐 外部ファイルの読み込みとパラメータの引き渡し <% %>の種類 <% %> このタグの内側はJavaScriptワールドになる。HTMLとしては出力されない
Autoprefixerのブラウザ指定をpackage.jsonの`browserlist`からする - fragmentary
さっきAutoprefixerの設定でいろいろ阿呆なことをして、まあそれは解決して、ついでにリリースノートを見ていたら6.6.0でこんな機能が入っていたのを知る。 With Autoprefixer 6.6 you can specify browsers in package.json to reduce config files: { "private": true, "devDependencies": { "autoprefixer": "^6.6.0", "postcss": "^5.2.6" }, "browserslist": [ "last 2 versions", "ie 9" ] } Note that we highly recommend specifying browsers in browserslist config or in package.json in
gulp4 lastRun関数の挙動 - Qiita
はじめに gulp4にはlastRunという関数が追加されました。gulp.src関数と組み合わせて使うことで、更新のあったファイルのみを後続のpipeに流すことができます。 公式ドキュメント この関数の挙動を理解するために、テスト用のコードを書いて実験をしてみました。 この記事の前提 想定する読者 この記事は、以下の方を想定しています。 gulp3をすでに利用したことがある gulp4への移行を考えている gulpのインストールやセットアップに関する内容は取り扱いません。 実行環境 この記事の実験用コードは以下のモジュールを利用しています。バージョンが異なる場合、この記事とは異なる結果になることがあります。 ▼package.json "devDependencies": { "del": "^4.1.1", "gulp": "^4.0.1", "gulp-imagemin": "^5.
Gulpでキャッシュ対策パラメータを自動付与する - Qiita
<!-- 読み込んでいるのは同じファイルでも、別物として扱われる --> <img src="/images/image.jpg"> <img src="/images/image.jpg?hoge"> 画像ファイルやcss、jsなどで幅広く応用できるため、特に開発進行中にテストアップした際、手元でキャッシュの飛ばし方がわからない程度のリテラシーを持ったクライアントとのやりとりを始め、様々な場面で使用する機会の多いことかと思います。 Gulp使ってるのに手動でパラメータつける（書き換える）のが面倒くさい 一つのファイルだけならいいのですが、読み込んでいるcssやjs、画像が増えてくるといちいち書き換えて回るのが面倒ですし、ヒューマンエラーも発生します。grepで書き換えてもいいんですが、せっかくなら自動で勝手に書き換えてほしいものですし、度重なる更新のたびに同じ作業を繰り返すのも億劫です。
[Gulp]これからはじめるGulp（0）：アドベントカレンダースケジュール
はじめに 「今かよ」って話なんですが、急遽はじめた一人アドベントカレンダーでどの日に何を書くか構成がきまっていなかったので考えてみた。 12/01：bundler, rbenv, nodebrewでGulp環境を作ってみる 12/02：gulp-sassを使ってSCSSをコンパイルするタスクを作ってみる 12/03：watchで変更を監視する 12/04：gulp-plumberでエラー時のwatchを解除させない 12/05：gulp-connectでWebサーバーとライブリロード 12/06：gulp-load-pluginsでプラグインの一括読み込み 12/07：gulp-ruby-sassでSassオプションの指定（bourbon, neat, bittersのロード） 12/08：頻繁に使いそうなモジュールを試す：JS,CSS圧縮系 12/09：頻繁に使いそうなモジュールを試す：
![[Gulp]これからはじめるGulp（0）：アドベントカレンダースケジュール](https://cdn-ak-scissors.b.st-hatena.com/image/square/28ce70a4ba19573c729e61a380304d78f3fccffd/height=288;version=1;width=512/http%3A%2F%2Fwhiskers.nukos.kitchen%2Fassets%2Fimages%2Fogp.png)
sizuhiko - Technote - gulp-rev-replace を使ってリビジョン管理をするときに注意したいこと
Saturday, May 02, 2015 03:51:00 PM JavaScript gulp gulp-rev JavaScriptでモダンな開発をするとき、gulpというビルドシステムを使うと、簡単にビルド過程を自動化できます。 さらに、JavaScriptでアプリケーションを作ったとき、ライブラリはCDNなどから取得するとして、自分で作ったスクリプトファイルは１つのファイルにまとめてミニファイズする、ということをgulpのタスクで書くでしょう。 一般的にJavaScriptやCSSをHTML上に記述するとき、以下のようにします。 <script type="text/javascript" src="/js/app.js"></script> <link rel="stylesheet" href="/css/app.css" type="text/css"> リリースしたのに
The Problem with gulp-util
Seeing this message?A little postmortemLast week we made gulp v4.0.0-alpha.3 available on GitHub and people are excited! We expected it to be breaking, but we didn’t realize the far reaching impact of the changes. This is due to 6,752 modules that depend on gulp-util; many of which utilize an extremely outdated version of Vinyl. Help us fix it using the steps below. Why deprecation now?We’ve been
gulp-util の問題、deprecation warning と migration path について - valid,invalid
2017年12月28日に The Problem with gulp-util という記事が公開された。 medium.com gulp をウォッチしていたわけではないのだが、たまたま残された gulp 資産を触っている時に deprecation warning がコンソールに出力され、そのメッセージ中にこの記事へのリンクがあった。 warning gulp > gulp-util@3.0.8: gulp-util is deprecated - replace it, following the guidelines at https://medium.com/gulpjs/gulp-util-ca3b1f9f9ac5 記事の内容を要約すると以下のようになる。 TL;DR gulp v4 リリースにあたり gulp-util はもう deprecation です gulp-util は
[gulp] 本番環境と開発環境を分岐するgulp-mode | バシャログ。
こんにちは、ishidaです。 2年前に半年かけておとした体重が見事にもとに戻りました。 新陳代謝がきっとすげー落ちているんだよ。そうなんだよ。はい。 今回はnpmの紹介です。 開発時と本番時で処理を変更したくなったことはありませんか？ このパッケージではgulpにて開発時と本番時のタスクを簡単に切り分けられます。 本番時 本番時にJSファイルをminifyしてみましょう。 var gulp = require('gulp'); var mode = require('gulp-mode')({ modes: ["production", "development"], default: "development", verbose: false }); var uglify = require('gulp-uglify'); gulp.task('default', function()
![[gulp] 本番環境と開発環境を分岐するgulp-mode | バシャログ。](https://cdn-ak-scissors.b.st-hatena.com/image/square/294ca83069b165921e9cb3cee0abe51a49c5b779/height=288;version=1;width=512/https%3A%2F%2Fbashalog.c-brains.jp%2Fimages%2Fcat_gulp.png)
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Sourcemaps only in Development