Grunt 日本語リファレンス | js STUDIO
このサイトについて Gruntの日本語リファレンスです。 Gruntの本家サイト(英文) の内容を翻訳して作成していますが、誤訳や誤記があると思いますのでその点についてはご了承ください。 もし、誤訳などの間違いを見つけましたら、 @tomof まで教えていただければ幸いです。 News 2013.04.15 サイトをオープンしました。 概要 何故タスクランナーを使うのか？ 一言で言えば、自動化のためです。 ファイル圧縮、コンパイル、単体テスト、Lintなどの繰り返し実行しなければいけないタスクを自動化することで、仕事を楽にしてくれます。 タスクランナーを設定すれば、こういった冗長的なほとんどの仕事を、あなたやチームのために行なってくれます。 何故Gruntなのか？ Gruntエコシステムは、巨大で日々成長しています。 Gruntを使って文字通り何百ものプラグインから選択し、最小限の努力で自
CoffeeScriptでモジュールを作る際のGruntfile.coffee - Qiita
$ npm install grunt grunt-contrib grunt-simple-mocha --save-dev module.exports = (grunt) -> grunt.loadNpmTasks 'grunt-contrib' grunt.loadNpmTasks 'grunt-simple-mocha' grunt.initConfig connect: server: options: port: 8888 base: '.' watch: coffee: files: "src/**/*.coffee", tasks: ["coffee"] coffee_with_test: files: ["src/**/*.coffee", 'test/**/*_test.coffee'], tasks: ["coffee:compile", 'simplemocha'
GruntでCoffee Scriptのコンパイル&Uglifyで圧縮 | DevelopersIO
Gruntとは 弊社ブログでもすでに紹介していますが、Gruntとはnode.jsベースで作成されたビルドツールです。 最近v0.4がリリースされ、Coffee Scriptがデフォルトでサポートされました。 今回は、変更が検知されたCoffeeScriptファイルをコンパイル→UglifyJSで圧縮 という処理をGruntでやってみます。 環境構築方法 今回使用した動作環境は以下のとおりです。 OS : MacOS X 10.7.4 Node.js : v0.10.0 npm : 1.2.14 Grunt : 0.4 npmを使用してGruntをインストールしておきましょう。 % npm install -g grunt-cli package.jsonとGruntfileを作成する Grunt(0.4)を実行するためには、２つのファイルが必要です。 まずはpackage.jsonを作成
コーダーさんの為のGrunt入門（前編）〜導入編 - Mach3.laBlog
この記事は賞味期限切れです。（更新から1年が経過しています） 以前はmakeを使って納品用のデータをビルドしていたりしたのですが、 去年くらいから代替にGruntを使ってみています。 この度0.3.xから0.4系に切り替えたので、覚書も兼ねてGruntの導入・使い方を記しておきます。 Gruntってなに Gruntを導入する 使ってみよう どんなタスクがあるの？ その他Gruntの魅力 まとめ Grunt ってなに GRUNT: The JavaScript Task Runner Gruntはnode.jsベースで作られたタスクベースのコマンドラインビルドツールです。 ビルドツールってなに ビルドは、ソースファイル群を元にして、実行出来る成果物を生成するプロセスの事を指します。 cf) ビルド (ソフトウェア) – Wikipedia 鍋に鶏と野菜とコンソメを入れて煮込んだらポトフが出来
Gruntで任意のシェルコマンドを登録する - Qiita
# in gruntfile.coffee {exec} = require('child_process') runCommand = (exp, done) -> exec exp, (error, stdout, stderr) -> return done(true) if error or stderr done(false,stdout) grunt.registerMultiTask 'test', 'test command', -> conf = @ done = conf.async() runCommand 'ls -l', (error, ret) => if error grunt.log.writeln('error') return done(false) grunt.log.writeln('done); done(true) 同様のことをする grunt-
Web制作で面倒な作業を自動化するビルドツール、Grunt v0.4 入門
Web制作で面倒な作業を自動化するビルドツール、Grunt v0.4 入門 2013-03-14 / 2014-03-12 Webサイトの表示速度を気にすると、CSSやJavaScriptのminify、gzip、CSS Sprite、画像の最適化などの面倒な作業が発生します。 Grunt.jsとは？ Grunt.jsは、サーバーサイドJavaScriptのNode.jsを使用したCUIのビルドツールです。 タスクを設定しておき、それらを自動化します。 コマンドプロンプトやターミナルなど、いわゆる「黒い画面」を使います。 Grunt.jsの現在のバージョンは0.4.1です。 バージョンが0.3から0.4になったことで、大きく仕様が変わりました。 Grunt.js v0.4ではgrunt-cliをインストールしてプロジェクトごとにGruntやプラグインをインストールして使用します。 プラグイ
[JS] Compass(Scss)のビルドが遅いので、マルチスレッドで高速でCompassビルドするgruntタスクを作ってみました - YoheiM .NET
[JS] Compass(Scss)のビルドが遅いので、マルチスレッドで高速でCompassビルドするgruntタスクを作ってみました こんにちは、@yoheiMuneです。 Compass(Sass)を仕事で使うのですが、@extendとかがいっぱいあるとビルドに時間がかかるようになってきました。 今回は、その対策としてgruntのタスクとして、compassビルドをマルチスレッドで高速化するタスクを作ったので、紹介させて頂きたいと思います。 Compassのビルドは時間がかかる？ Compassってすごく便利なツールで、CSSをモジュールか出来たり案件ごとに使い回したりして、CSSのコーディングの効率化が出来ます。 でも、画像のBase64化やSprite化、@extendで共通Compassモジュールを使うコードなどが増えると、コンパイルに時間がかかってきます。 自身が関わっている案
![[JS] Compass(Scss)のビルドが遅いので、マルチスレッドで高速でCompassビルドするgruntタスクを作ってみました - YoheiM .NET](https://cdn-ak-scissors.b.st-hatena.com/image/square/be8a85a78049a62f12c7fca35a7418bb8dcd8564/height=288;version=1;width=512/https%3A%2F%2Fwww.yoheim.net%2Fimage%2F217.jpg)
grunt-contribさえあればOK！ - MOL
世の中、Grunt0.4 が出たって持ちきりでやんス。 Grunt 0.4.0 released - Grunt: The JavaScript Task Runner 今までビルトインタスクだった下記はことごとく grunt-contrib-*シリーズと呼ばれるプラグインに置き換わってしまった。 concat grunt-contrib-concat plugin init stand-alone grunt-init utility lint grunt-contrib-jshint plugin min grunt-contrib-uglify plugin qunit grunt-contrib-qunit plugin server grunt-contrib-connect plugin test grunt-contrib-nodeunit plugin watch grun
YeomanでAngularJSしてCoffeeScriptにしてみた。っていうかGrunt最強って話 - bathtimefish's blog
JavaScript FrameworkならBackboneでしょ。 と勝手に思い込んでそればっか使ってきたボクですが、年初にheavenshellとかどっぺちゃんとで飲んだ時にviewが重くなるよね―とか話してたしかにそれ悩みだよなと思った。 そんときAngularJSってどうなんだろうねーって話にちょっとなって、そんときからangularいつかやってみようと思いつつ仕事で忙殺されてたんだけど、今日何気にSNSで「AngularJSに仮入信してみる」ってつぶやいたらGoogleの人にいいね！してもらってちょっと上がった。 さらに都合のいいことに外出で2時間程度電車に乗ってヒマな時間ができたので、車中でAngularの洗礼を受けてみようとPCを開いた次第。ちなみに途中で酔いました。以前新幹線で思い知ったのだけど懲りてなかった。電車でコーディングは控えましょう。特に自分。 さて、Angula
GruntをスクラッチなJavascriptプロジェクトに導入する
GruntをスクラッチなJavascriptプロジェクトに導入するJavascript 向けのプロジェクトビルドツールである，Grunt というものがある．今お手伝いしているプロジェクトでそろそろ scaffold 的なものが必要になってきた．なので，まずはここのドキュメントを参考にしながら，クリーンでスクラッチな Node 向けのプロジェクトに Grunt を導入してみる．その次に grunt-init で簡単な単体テストのコードのテンプレを作成できるようにしてみる． 前提今回のこのブログ記事で利用する Grunt のバージョンは，現時点の 0.4.x 系バージョンを利用して進めていく．ここにも書いてあるとおり，0.4.x 系では 0.3.x 系と比べると大分変わっているので，従来から Grunt を利用している方は，変更点を確認した方がいいと思う．というより，確認するべき！ Nodeバ
grunt-initでプロジェクトにscaffoldな仕組みを導入する
grunt-initでプロジェクトにscaffoldな仕組みを導入する前回のブログの続き． 前回のブログでは，Javascript なプロジェクトに scaffold 的な導入するための準備として，Grunt を導入して Gruntfile.js でプロジェクトのビルドをタスクベースでできるようにした． 今回はいよいよ，前回のプロジェクトをベースに単体テストのテンプレートコードの生成のサンプルとして，本来の目的であった grunt-init によって，scaffold 的な仕組みを導入できるようにする． 注意事項今回の説明で利用する grunt-init のバージョンは 0.2.0rc3 でまだ正式リリースされていません(unrelease)．なので，リリース版のときは，今回の手順・方法で動作しない可能性があるのであしからず．また，今回のブログ記事の内容が README.md の更新により
makefileを廃絶してgruntを使う
JavaScriptを使った開発で必要となるconcat, minify, lint, test といったタスクを動かすのに使うツール、最近はgruntをよく見かけるのでオレオレmakefileから移行してみた。 既存のmakefileは以下の通り。makefile + makeターゲットから呼び出される各種タスクに対応した処理を行なうプログラムという構成。make minifyと打てば圧縮版のファイルを生成、make testと打てばテストが実行される寸法だ、圧縮にはuglify.js, lintにはjshint、全てnodeモジュールを使っているのでそのまま移行できるはず。concatにはmuというテンプレートエンジンを使っていた。 makefileからの移行 まず、gruntの制御に必要なgrunt.jsファイルは grunt init:gruntfile して生成する。concat
Gruntの概要と導入手順とメリット | 1000ch.net
2012/12/08 Gruntとは grunt: a task-based command line build tool for JavaScript projects もはや説明不要の可能性もありますが、 gruntがgrunt-cliへの移行(?)をしたこともあり、まとめてみました。 コマンドラインで使用するビルドタスクのツールです。 js(ほぼjson)の設定ファイル上に、concatやminifyといったようなタスクを定義し、 コマンドラインから実行します。言葉だけだとイメージ湧きにくいと思いますので、 使ってもらうのが一番と言い張って導入手順の説明に入ります。 npmからgrunt-cliをインストールする （nodeとnpmはインストール済み・・・よね？） npm install -g grunt-cli これで核となるCLIのインストールは完了です。 ターミ
YeomanとBrunchをさわさわした
Yeoman - Modern workflows for modern webapps Brunch | HTML5 application assembler 今回はニュートラルな気持ちで、並べて触ってみるのが目的なので、どっちが良い・悪い、という評価的な主張は重きを置いてない。（感想としては混じってるけど）淡々と記録しているだけなので、流し読んでいただければ幸い。 CompareTable Install Skeletons/BoilerPlate Scaffolding (generate/destroy) Build Server & Watch Test PackageManager Conclusion Compare Table とりあえず比較表。オリジナルから行列加えてる。 Original: Compare Table - Brunch | HTML5 applicat
Gruntfile.jsは.coffeeのほうが扱いやすい
設定が肥大化したときにミスりやすい WebStormぐらい賢いエディタ（IDE）を使っているときはよいのですが、簡素なエディタでちょいちょい編集したいときなどに、しょーじき、カンマとか波括弧（brace）の閉じを誤ることがあります。 Adding preliminary CoffeeScript support. This is for issue #124. · 2f1cd72 · cowboy/grunt This should properly search for: grunt.js or grunt.coffee grunt file in current or parent directories tasks written as .js or .coffee files init templates written as .js or .coffee files そこでcow
Gruntによる継続的なビルド環境を求めて 〜 package.jsonと0.4.0のこと
安定したビルド環境 gruntの広まりを感じる...。みんな...package.jsonをつかうのです...そしてバージョンにも気を遣ってstableな環境を目指すのです....安定して使えないビルド環境はいくらナウくてもゴミです....。 — aho.mu (@ahomu) December 11, 2012 夏前に、nodeでビルドってなんかナウい(∩´∀｀)∩ワーイって使い始めて、秋から現職のプロジェクトで実践してみた結果、そんな当たり前な視点を忘れないようにしなければ、と強く思った次第。 今回は下記の2点を紹介します。 Gruntと永く付き合うためのノウハウとして、package.jsonを使った管理について 賞味期限の短いノウハウとして、Grunt 0.4.0への移行に関して Gruntイイヨーの続きとして、今後付き合っていくために必要なことを改めておさらい。 1. packa
gruntでstyleDoccoを自動化 – LOG
grunt-styleguideというgruntのプラグインがあるので、使った方が良いと思うんですが、自分の環境ではうまく動かなかったので、以下の内容で登録しました。 #grunt.js v0.3 var exec = require('child_process').exec; grunt.task.registerTask('styleguide', '', function(){ exec('styledocco -n "style guide name" --preprocessor "sass" sass/styleguide.scss'); }); watchで監視したいので watch:{ styleguide:{ files:'sass/styleguide.scss', tasks:['styleguide'] } } ## 追記：原因わかりました。 上に書いている、『*
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
pieter michels - Grunt.js and Require.js: compiling with r.js
grunt0.4.0をインストールした
grunt のバージョン上げずにタスクを CoffeeScript でかく - Qiita
