Gulpでのファイル名変更

CSSやJavaScriptファイルを最小化する際、最適化されたファイルの名前に min という印が付けられていると非常に便利です。例えば、styles.min.css のようになります。

このために使用されるのが gulp-rename プラグインで、これは保存前にファイル名を変更します。プラグインをインストールするには、コマンドラインで次のコマンドを実行する必要があります：

npm install gulp-rename --save-dev

次に、CSS最小化ツールとインストールしたリネームプラグインを接続しましょう：

let {src, dest} = require('gulp');
let cleanCSS = require('gulp-clean-css');
let rename = require('gulp-rename');

では、ファイルを保存する前に名前を変更しましょう：

function task(cb) {
	return src('src/*.css')
		.pipe(cleanCSS())
		.pipe(rename({
				extname: '.min.css'
			})
		)
		.pipe(dest('dist'));
}

gulp-uglify プラグインを使用してJavaScriptファイルを最小化し、生成されたファイルが拡張子 .min.js を持つようにしてください。