You signed in with another tab or window. Reload to refresh your session. You signed out in another tab or window. Reload to refresh your session. You switched accounts on another tab or window. Reload to refresh your session. Dismiss alert
Advanced tips for using gulp.js After getting excited about gulp.js, at some point you need more than the shiny but basic examples. This post discusses some common pitfalls when using gulp.js, plugins and streams in a more advanced and custom way. Basic tasks In a basic setup, gulp has a nice syntax to use streams and plugins to transform your source files: gulp.task('scripts', function () { retur
相変わらず仕事ではデザインやりつつJavaScript書いている。 タスクランナーとしてGrunt.jsを使っていたけれども、使ううちに段々不満がでてきた。遅かったり、記述が冗長になりがちでつらかったので最近になってgulpに乗り換えた。 gulpは良い。タスクは自動的に並列に実行され、かつストリームで処理されるので速いし、タスクの記述もストリームベースの書き方のおかげでGrunt.jsに比べるとだいぶ短くなる。 ただ、そこらにあるgulpをちょっと試しただけの日本語の記事やドキュメントをみてても実際のプロジェクトで使えるレベルまでの知識を得られず学習に一日かかった。 この記事では、gulpをまともに使えるようになるまでに必要な知識を書く。 導入とHelloWorld まずは導入。npmからgulpをインストールする。 $ npm install gulp -g $ gulp -v [gu
Delays in performance have the potential to impact user engagement, experience and revenue. Thankfully, Google’s ‘Make The Web Faster’ team recommend a set of best-practice rules for keeping your pages lean, fast and smooth. These include minifying resources like CSS and JavaScript, optimizing images, inlining and removing unused styles and so on. If you have complete control over your server, an
Gruntfile.js は常々長すぎると思っていました。複数ファイルに分割しようが長いものは長いです。 最近、後発の gulp というものを見つけて使ってみていますが、いい感じです。 設定ファイルが短く書ける上に、速いです。 先日 Grunt 入門の記事「Web デザイナーさん向け Grunt を使った コーディング作業の効率化、はじめの一歩」を読んで、例の Gruntfile.js と同等の内容を gulp で書いたらどうなるかなと思って書いてみました。 サンプルファイル含めたプロジェクト全体 gulpfile.js だけ 67 行から 29 行に。約半減です。また、短くなっただけではなく、処理の流れがわかりやすくなっていると思います。 var gulp = require('gulp'); var concat = require('gulp-concat'); var prefix
Just when you think that you're in control, Just when you think that you've got a hold, Just when you get on a roll, Here it goes, here it goes, here it goes again. OK Go - Here It Goes Again And so the evolution of front-end development continues with Gulp, the new build system that has already garnered praise amongst many web developers. After spending some time reading the docs and playing arou
JSer.info #162 - plugableなJavaScript LintツールのESLint 0.4.0がリリースされました。 .eslintrc の設定ファイルにYAMLで書くことが出来るようになった事やJSDocのバリデーション等のルールの追加修正があります。 また、今後の予定についてのRelease goalsが更新されて、今までLintのルールを書くときに素でASTを見て行っていましたが、AST Queryライブラリを使えるようにする等の予定が追加されました。 (また0.4でもパフォーマンスの改善等が入ってますが、以前よりも早めにパフォーマンス改善を進めていくようです) Evaluate ESQuery, CSSAuron, other AST querying · Issue #476 · eslint/eslint JavaScript ASTを使ったツールについても
A brief history of Grunt I realized that a task-based build tool with built-in, commonly used tasks was the approach that would work best for me Ben Alman March 2012 Single, global Grunt: $ npm install -g grunt Configuration over code grunt.initConfig({ lint: { src: 'src/<%= pkg.name %>.js' }, concat: { src: [ '<banner:meta.banner>', '<file_strip_banner:src/<%= pkg.name %>.js>' ], dest: '<%= pkg.n
タスクランナー Grunt の対抗馬として今年あたりブームがきそうな gulp.js ですが、TypeScript をコンパイルするプラグインが見当たらなかったので作りました。 https://npmjs.org/package/gulp-tsc https://github.com/kotas/gulp-tsc 使い方 npm install --save-dev gulp-tsc して gulpfile.js で以下のように require('gulp-tsc') するだけで使えます。 var gulp = require('gulp'); var typescript = require('gulp-tsc'); gulp.task('compile', function () { gulp.src(['src/**/*.ts']) .pipe(typescript()) .pipe
Name : azu Twitter : @azu_re Website: Web scratch, JSer.info Browserify npmとbrowserifyを使ったクライアントサイドのウェブアプリ開発 | Web scratch を書くまでの話 ビルドフェーズがあるのでデバッグしにくいと思ってた => sourcemap様 ビルドに時間かかる 最小でも0.3sぐらいかかってる 確かにライブラリとか全部含めると数秒かかる --noparse は 分割ビルドとかで改善できる? gulp.task('js' とか0.5sぐらいまで削れる Browserify-dev 想像以上にnodeな感じで書けるのは心地よい ブラウザ向けに書かれたライブラリを使う方法が意外と充実してる gulp コードとして書く Deprecating gulp.run no longer allows de
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く