gulp:consoleやalertを削除するのに便利なプラグイン「gulp-strip-debug」

gulp:consoleやalertを削除するのに便利なプラグイン「gulp-strip-debug」

ちょっと覚えておきたかったので備忘録兼ねて。
gulpを使ったビルド時に、JSファイルからconsolealertを削除(正確には変換)してくれるプラグイン「gulp-strip-debug」を紹介します。

プラグインのインストール

「gulp」は既にインストール済みという想定で、まずは下記をコマンドに入力して「gulp-strip-debug」プラグインをインストールします。

$ npm i -D gulp-strip-debug

$ npm install gulp-strip-debug --save-devでも可。

また、詳しくは後述しますが「gulp-uglify」というプラグインも下記をコマンドに入力してインストールしておきます。

$ npm i -D gulp-uglify

$ npm install gulp-uglify --save-devでも可。

タスクの記述

実際のタスク記述例としては下記のように記述し、gulp.src()で指定されたファイルをgulp.dest()に出力する間にある2つの処理を行うことで、該当のJSファイルに記述されているconsolealertを削除することができます。

gulpfile.js

var gulp = require( 'gulp' ),
    stripDebug = require( 'gulp-strip-debug' ),
    uglify = require( 'gulp-uglify' );

gulp.task('build:js', function() {
  return gulp.src(paths.src)
      .pipe(stripDebug())
      .pipe(uglify())
      .pipe(gulp.dest(paths.dest));
});

paths.srcpaths.destとしている部分は、それぞれファイル指定のパスを記述する部分になるので、自身の環境に合わせて任意のものに変更してください。

具体的な動きとしては、まず「gulp-strip-debug」がconsolealertvoid 0;に変換してくれます。
もともとの動きは削除だったようですが、いろいろなケースを考えた結果void 0;に変換する形にしたようです。
その後、記述が一部変換されたファイルに「gulp-uglify」を使用してファイル圧縮を行うとvoid 0;は不要と判断され記述自体が削除されるので、結果的にconsolealertが削除されるという動きになります。
本番で動かないように削除したり無効化する方法はいろいろありますが、gulpを利用していて、ついつい消すのを忘れてしまうとか手っ取り早く削除したいという人には便利そうです。

同じように削除するプラグインとして「gulp-remove-logging」というプラグインもあり、こちらの場合はconsoleを変換ではなくちゃんと削除してくれるのですが、alertは残ってしまうとか結局不要になった行を削除するので「gulp-uglify」などを使う必要もあったりしたので、alertも消せる分「gulp-strip-debug」の方が良かったです。

プラグインの詳細などについては、以下で確認できます。

Close the search window,
please press close button or esc key.