grunt

npmでGruntを動かしたときのエラー対処。とwatchオプションのlivereload

grunt

1.javascriptの処理をそのまま実行できるカスタムタスク

カスタムタスク内は自由な記述が可能
[javascript]
module.exports = function(grunt){
grunt.registerTask('default','”hellow”と表示',function(){
grunt.log.writeln('Hellow').ok();
});
};
//grunt
[/javascript]

// 2.コマンドの引数受け取り

[javascript]
module.exports = function(grunt){
grunt.registerTask('displayArgv','引数表示',function(argv1,argv2){
grunt.log.writeln('argv1:' + argv1);
grunt.log.writeln('argv2:' + argv2);
})
}
//コマンド上で
grunt displayArgv:foo:bar
//argv1: foo
//argv2: bar
[/javascript]

ターミナルで
npm install
したら
このようなエラーが出たら

If you're seeing this message, either a Gruntfile wasn't found or grunt
hasn't been installed locally to your project. For more information about
installing and configuring grunt, please see the Getting Started guide:

プロジェクトにGruntfile.jsがありませんよ
こちらを実行
cd ~project
npm install --save-dev grunt

このようなエラーが出たら
kenjimorita-MacBook-Pro:study ***$ grunt

Local Npm module "grunt-combine-media-queries" not found. Is it installed?
Local Npm module "grunt-contrib-uglify" not found. Is it installed?
Local Npm module "grunt-csscomb" not found. Is it installed?
Local Npm module "grunt-imageoptim" not found. Is it installed?
Local Npm module "grunt-pngmin" not found. Is it installed?
Local Npm module "grunt-styleguide" not found. Is it installed?
Local Npm module "grunt-text-replace" not found. Is it installed?
Local Npm module "grunt-usemin" not found. Is it installed?
Running "connect:server" (connect) task
Started connect web server on https://0.0.0.0:9000

Package.jsonには書いてあるけど実際ローカルにこれらのプラグインインストールされていませんよ。
こちらのコマンドを実行
npm install --save-dev プラグイン名
npm install --save-dev grunt-contrib-uglify

※プロジェクトファイルでnpm install
$ npm install --save-dev // package.json 側に devDependencies と書いてあれば --save-dev は無くてもいい。
--save-devはpacage.jsonにインストール時に記述するコマンド

このようなエラーが出たら
npm ERR! peerinvalid The package grunt-contrib-coffee does not satisfy its siblings' peerDependencies requirements!
npm ERR! peerinvalid Peer grunt-contrib@0.11.0 wants grunt-contrib-coffee@~0.10.0

バージョンが違いますよ。
この上記の peerが今のバージョン。wantsのところが要求バージョン。

ライブリロード便利だなー。
これをGruntfile.jsに追加して
chromeとかfoxのアドオン追加すればいいみたい
https://chrome.google.com/webstore/detail/livereload/jnihajbhpnppcggbcgedagnkighmdlei
[javascript]
watch: {
sass: {
files: ['<%= dir.sass %>/.scss'],
tasks: ['compass']
},
html_files:{
files:'html/
.html'
},
options:{
livereload: true
}
}
[/javascript]