gulp の gulp-rename モジュールを使って出力するファイルに .min をつける方法
10 years ago
hoge.js を minify したファイルを hoge.min.js として
出力する方法です.
gulp-rename ってやつを使います.
拡張子を .js から .min.js に変換する
gulp-rename というタスクを使います.
下記コマンドでインストールできます.
$npm install --save-dev gulp-rename
ついでに uglify も
$npm install --save-dev gulp-uglify
あとは gulpfile.js に下記のようなタスクを 書けばOK♪
var gulp = require("gulp");
var rename = require("gulp-rename");
var uglify = require("gulp-uglify");
gulp.task("build", function() {
gulp.src('./hoge.js')
.pipe(uglify())
.pipe(rename({
extname: '.min.js'
}))
.pipe(gulp.dest('./'))
;
});
$gulp build
を実行すると hoge.js と同じ階層に hoge.min.js というファイルが出力されるのがわかるかと思います.
gulp-rename って?
ファイルを簡単にリネームすることができる gulp 用のプラグインです.
単純にファイル名を置き換えたり
gulp.src("./hello.txt")
.pipe(rename("./goodbye.md"))
.pipe(gulp.dest("./dist")); // ./dist/goodbye.md
関数を渡したり
gulp.src("./hello.txt")
.pipe(rename(function(path) {
path.dirname += 'page';
path.basename += '-world';
path.extname = '.md';
}))
.pipe(gulp.dest("./dist")); // ./dist/page/hello-world.md
ハッシュを渡したり
gulp.src("./hello.txt")
.pipe(rename({
dirname: "main",
basename: "test",
prefix: "pre-",
suffix: "-suf",
extname: ".md"
}))
.pipe(gulp.dest("./dist")); // ./dist/main/pre-test-suf.md
ってことができます.