DNET_Grunt

Grunt

• 戻る（の該当節）

概要

最近は、npm(npm-scripts) がタスク・ランナー機能を統合しつつあり、廃れつつある。

• JavaScriptフロントエンド開発用のタスク・ランナー

  • スクリプトの自動化
  • TypeScriptコンパイル
  • コード品質の "lint"ツール
  • CSSプリプロセッサ

• プラグイン

  • grunt-contrib-copy：ファイルやディレクトリをコピー。
  • grunt-contrib-cssmin：CSSを小さくしてサイズを縮小する。
  • grunt-contrib-uglify：JavaScriptを小さくしてサイズを縮小する。
  • grunt-contrib-concat：ファイルを1つのファイルに結合する。
  • grunt-contrib-clean：ファイルやディレクトリを削除。
  • grunt-contrib-watch：ファイルの活動を監視するプラグイン。
  • grunt-contrib-jshint：JavaScriptコードの品質を確認する。

参考

• Grunt: The JavaScript Task Runner
  https://gruntjs.com/

• gruntjs/grunt: Grunt: The JavaScript Task Runner
  https://github.com/gruntjs/grunt

• Gruntを使ってJSやCSSの面倒なタスクを自動化しよう | kudox.jp
  http://kudox.jp/server/grunt-js

• OpenTouryoProject/OpenTouryo > Issue #296

  • The Unicode symbol for the content property in font-awesome.css is garbled by BundlerMinifier.Core.
    https://github.com/OpenTouryoProject/OpenTouryo/issues/296

プラグイン（参考）

grunt-contrib-copy

• Grunt.jsでファイルコピーを行うGruntfile.js 普通にsrcとdestでは、
  srcフォルダ構成をそのままdest先にコピーしてしまうので、cwdとexpandオプションを利用している。
  プラグインは自動的にpacage.jsonを読み込むようにしている。
  https://gist.github.com/gurimmer/7464028

• Beekeeper Design Studio » How to Copy files to Another folder with Grunt
  http://www.beekeeperstudio.com/2016/11/how-to-copy-files-to-another-folder-with-grunt/

grunt-contrib-cssmin

未記載（元 Wiki も見出しのみ）。

grunt-contrib-uglify

未記載（元 Wiki も見出しのみ）。

Gulp

• Gulp

移行メモ

• 元 Wiki では見出しそのものが他ページへのリンクになっていた箇所 （「Gulp」）は、GitHub Wiki では見出しからアンカが生成されるため、 見出しをプレーン・テキストとし、リンクは直下の本文に置いた。
• 同名の見出し（「プラグイン」）が概要の箇条書きと重複するため、 参考節側は括弧で文脈を補って一意にした。
• 本文の無い見出し（grunt-contrib-cssmin / grunt-contrib-uglify）は、 その旨を明示した。
• PukiWiki のページ内アンカ（#xxxxxxxx）は GitHub Wiki では再現できないため、 「戻る」は該当節を添える形に置き換えた。
• 引用元の「pacage.json」は原文ママ（package.json の誤記と思われる）。

---

Tags: 移行, Grunt, タスク・ランナー, npm-scripts, プラグイン, Gulp, フロントエンド