【Gulp】gulp-renameで出力ファイルを簡単操作 | バシャログ。
どうもfujiharaです。本日はgulpの便利プラグイン gulp-rename をご紹介します。 背景 gulpを使う場合src, dist でソース、出力先を指定するとかと思います。 gulpfile.js import gulp from 'gulp'; const { src, dest } = gulp; export default () => { return src('src/js/*.js') .pipe(processA()) // 処理A .pipe(processB()) // 処理B .pipe(dest('dist/js')); } tree (ディレクトリ抜粋) ├── dist │ └── js │ └── index.js ├── gulpfile.js └── src └── js └── index.js gulp-rename gulp-r
gulp-directory-sync でディレクトリを同期する | バシャログ。
どうもfujiharaです。ただいまテレワーク中です。本日はgulp-directory-syncを使って ディレクトリを同期する方法をご紹介します 追記:2021/06/28）まずこちらの記事を参考にしていただき、駄目な場合はこちらのgulp-directory-syncをお試しください。 背景 WordPressを開発する際には以下のような構成で行っております。 (以下リポジトリルートです) . ├── frontend_check (コーディング用) ├── gulpfile.js ├── package.json ├── src (各種ソース) ... (その他各種設定フィル等) srcディレクトリで各種ソースを用意しgulpで運用してfrontend_checkに吐き出すイメージです frontend_check以下はこの様になっています frontend_check ├── a
[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()
【Nunjucks+Gulp】変数と変数でよく使うフィルタについて | バシャログ。
前回の記事、JSテンプレートエンジン「Nunjucks」とgulpで快適HTMLコーディングでNunjucksについて、 ざっくりと駆け足でご説明しました。 今回からシリーズで？いろいろな機能を紹介できればと思います。 Nunjucksとは FireFoxブラウザでおなじみmozilla謹製のJavaScriptテンプレートエンジンです。 Pythonテンプレートエンジン Jinja2 に影響を受けて、誕生しました。 githubでのstar数は、4886（2018/01/25現在）です。 Nunjuck 前準備 インストール 今回必要な、パッケージをインストールしておきます。 $ npm init $ npm i -D gulp gulp-nunjucks-render ファイルおよびディレクリ構成 srcからdistへ出力する想定です。 dist src └ index.njk gul
JSテンプレートエンジン「Nunjucks」とgulpで快適HTMLコーディング
もうすぐハロウィン。アラフォーにもなって今週末にはじめて仮装してみることにしました ishida です。 はじめてのことで、何に仮装すれば迷いまくっています。 さて、今回は、テンプレートエンジン「Nunjucks」についてご紹介です。 Nunjucks とは FireFoxブラウザでおなじみmozilla謹製のJavaScriptテンプレートエンジンです。 Pythonテンプレートエンジン Jinja2 に影響を受けて、誕生しました。 githubでのstar数は、4660（2017/10/26現在）です。 Nunjucks 特徴 node.js で動作 マクロ定義 オートエスケープ リッチブロックの継承 extends によるテンプレート継承 block によるエリアの継承 include による外部ファイル読み込み などです。 記述サンプル 以下が、Nunjucksのコードサンプルです
gulpとgridとIEを仲良くさせる方法 | バシャログ。
引っ越ししたオフィスでは外食してランチを充実させよう！と決意したのに、暑いからとついつい一階のナチュラルローソンや最寄り駅との間にあるローソンに頼ってしまうyanagimachiです。関内のオススメランチの場所があったら教えてください！ さて、フロントエンドエンジニアの間でちょっとgridを使ってみよう、ということになったのですがIE（IE11とIE10）の対応やいつものgulpの環境だと色々大変だったので、メモしておこうと思います。 gridって何さ？ gridって何だろう？と調べてみたところ、MDNのグリッドレイアウトがわかりやすかったです。 行と列で要素を配置することのできるレイアウト配置ができるということで、テーブルレイアウトをHTML構造が正しい要素でできるようになったと考えればいいかと思います。gridという名前から、当初flexと変わらないのでは？と思ったのですが、縦も横も指
フロントエンドの人でも楽して、PHPが使える環境をサクッと用意したいのだ！ | バシャログ。
こんにちは、ダイエット生活1ヶ月経過のishidaです。 この１ヶ月、以下のルールを守って生活したら1ヶ月で4kg体重が減りました。 ・1日１回スムージー ・揚げ物は食べない この調子のままいくと桜の季節には体重が50kgになるぜよ。 さてさて、PHPを使うにはこれまでMAMP・XAMPPやVagrantなどの仮想環境をそれぞれ用意していました。 データベースを使用しない場合は、簡単にPHPを使う方法が他にあるんですね。 もっと早く知りたかった―。会いたかった―。会いたかった―。会いたかった―。イェス！！ PHPのビルトインサーバ PHP 5.4.0 からウェブサーバの機能が組み込まれています。 この機能を使うことでサクッとPHPが使えるようになります。 ※なおウェブサーバの機能はアプリケーションの開発支援用に設計されているので、公開サーバでは使用しないように。 PHPのインストール まず
WordCamp Tokyo 2015 に行ってきました #wctokyo | バシャログ。
ねんがんの VAIO Z をてにいれた kagata です。おおむね満足しているのですが、本体色をシルバーにしたらキーボードが MacBook のぱちもんみたいで、人に見せるたびつっこまれています。これから購入を検討される方には順当にブラックをおすすめしたいです。 そんな VAIO Z をひっさげて、先週末10月31日（土）に開催された WordCamp Tokyo 2015に行ってきました。今回は参加したセッションについてご報告します。 参加したセッション 今回はエンジニアリング寄りのものを中心に以下のセッションを選びました。 【基調講演】「なんとなく」の壁を越えよう！自信を持って WordPress を選択するためのヒント オープンデータとオープンソース、そしてWordPress WordPressで行う継続的インテグレーション 入門編 -プラグイン開発・保守地獄から学んだこと- レス
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
