JSのminify

Gruntを使ってrequirejsを使ったプロジェクトのminifyを行う。

まずはGruntをインストールする前にWebを参考にnode.jsをインストールする。

• Gruntのインストール

• npm install -g grunt-cli

• インストールの確認

• grunt -version

• package.jsonの作成
• プロジェクトのカレントディレクトリに移動し、npm initを実行
  いくつか質問されるので、entry pointには「Gruntfile.js」を指定し、それ以外は任意で指定する
• プラグインのインストール
• 今回はrequirejsを使用した圧縮と統合が目的なのでgrunt-contrib-requirejsをインストールする

• npm install grunt-contrib-requirejs -save-dev

• Gruntfile.jsの作成と編集
• プロジェクトのカレントディレクトリに「Gruntfile.js」を作成する
• 中身はこんな感じ

  module.exports = function(grunt) {
    grunt.initConfig({
      requirejs: {
        compile: {
          options: {
            baseUrl: 'hoge/fuga/js',
            name: 'main',
            out: 'tmp/main.min.js',
            preserveLicenseComments : false,
            done : function(done, build) {
              grunt.file.write('tmp/done-build.txt', build);
              done();
            }
          }
        }
      }
    });
  
    grunt.loadNpmTasks('grunt-contrib-requirejs');
  
    grunt.registerTask('default', ['requirejs']);
  };
  

• 実行

• grunt

  もしくは

  grunt requirejs

  で実行可能。実行するとtmpディレクトリ下にminifyされたjsが出力される