Grunt入門

999 views

Published on

サーバーサイドJavaScriptのNode.jsでつくられたタスク管理パッケージGruntの入門。
Node.jsのインストールから、Gruntのインストールまでを説明しています。

0 Comments
2 Likes
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total views
999
On SlideShare
0
From Embeds
0
Number of Embeds
6
Actions
Shares
0
Downloads
9
Comments
0
Likes
2
Embeds 0
No embeds

No notes for slide

Grunt入門

  1. 1. GRUNT‾!GRUNT¾ Õçß vœØk−‾—Created by /Kobayashi Kazuhiro kzhrk.com @mizukamik
  2. 2. :Ÿ”̊©Grunt » Grunt”¾ Õçß Øk ³q•»
  3. 3. GRUNT »Node.js³³i|¤Ïþ è ¾ ”ò èâß ÜÕ˳Ł1|–ux ƒ©œ³Šøa x−
  4. 4. ÜÕË”Šøa »
  5. 5. # sass sass --watch src/sass:src/css # TypeScript tsc -w src/ts/script.ts -outDir src/js # CoffeeScript coffee -cw src/coffee -o src/config
  6. 6. ('A`)„̈¤̊̃¡
  7. 7. ô¹¾ ”V¾a¶∙”ŠøaØ °©−” v¢0ØË ¾¼ çØà èžßÒßØ Happy
  8. 8. GRUNT”¾ Õçß
  9. 9. NODE.JS”¾ Õçß
  10. 10. MAC”þ  pkg³ÝÁ ßè|–Ýõ Ë áË http://nodejs.org/
  11. 11. WINDOWS”þ  1. node.exe ³ÝÁ ßè| ²”ôÄ Ý•Àø 2. %ÈNcNODE_HOME •1. node.exe ³ÝÁ ßè|¤ôÄ Ý³Ł1 3. %ÈNcPATH •%NODE_HOME% ³ g http://nodejs.org/download/
  12. 12. ¾ Õçß ”Î $ node -v
  13. 13. Ł1ô¹¾package.json Gruntfile.coffee(Gruntfile.js)
  14. 14. PACKAGE.JSON npm init
  15. 15. PACKAGE.JSON Ð™Ñ¾ç” ³̨Ö { "name": "grunt-sample", "version": "0.0.1", "private": true, "dependencies": { "grunt" : "git://github.com/gruntjs/grunt.git#master", "grunt-contrib-watch" : "~0.5.3", "grunt-contrib-connect" : "~0.5.0", "gurnt-contrib-copy" : "~0.4.1" } } Plugins
  16. 16. PACKAGE.JSON package.json”dependencies•l¡|¤ðáÍßÔw node_modulesÝÁ ßè©—¡ npm link
  17. 17. GRUNTFILE.JS (GRUNTFILE.COFFEE) # Gruntfile.coffee module.exports = (grunt) -> grunt.initConfig connect: server: options: port: 9001 base: 'src' watch: options: livereload: true html: files: 'src/index.html'
  18. 18. grunt-contrib-watch grunt-contrib-connect grunt-contrib-clean grunt-contrib-copy grunt-contrib-concat grunt-contrib-cssmin grunt-contrib-uglify grunt-contrib-csslint grunt-contrib-jshint grunt-contrib-sass grunt-contrib-less grunt-contrib-stylus grunt-contrib-imagemin øz³qGRUNTPLUGINS
  19. 19. ³i¡−Ïþ 蔾 Õçß # sass gem install sass # compass gem install compass
  20. 20. Øk ”−‾
  21. 21. öÀô JavaScript»concat|¤Ø”³̨Ö éô JavaScript»concat|–minify|¤Ø”³̨Ö
  22. 22. ’∼÷mßw q’‘o—|¤

×