事象
- gulp で「JavaScriptのコード圧縮」と 「ES6(ES2015)→ES5への変換」を同時行うと、「JavaScriptのコード圧縮」だけが反映されない
- コマンドプロンプト上では、タスクはエラーなく回っている
- 現状は個別にタスクを実行しないと「JavaScriptのコード圧縮」されない
実現したいこと
gulpコマンドのみで(個別にタスクを実行せずに)、
「JavaScriptのコード圧縮」と 「ES6(ES2015)→ES5への変換」を同時に行いたいです。
お詳しいかたでどなたかご教授いただけないでしょうか?
よろしくお願い致します。
191003追記
「トランスパイル」は出来るのですが、
'gulp js
を実行しても、「トランスパイル」が行えない状態になっております。
gulp js-browserify
gulp js-uglify
を個別に実行するか、
gulp js
実行後に改めて、gulp js-uglify
を実行しないと実現したいコードが吐き出されない状況となっております。
フォルダ構造 / ファイル一式
https://github.com/nihonium/00__project
ソースコード(gulp)
gulpfile.js
// 外部ファイル読み込み const config = require('./config'); // gulpプラグインの読み込み const gulp = require('gulp'); const runSequence = require('run-sequence'); ・・・中略・・・ // JavaScript const uglify = require('gulp-uglify'); const babel = require('gulp-babel'); const browserify = require('browserify'); const source = require('vinyl-source-stream'); const babelify = require('babelify'); ・・・中略・・・ // ファイル名変更 const rename = require('gulp-rename'); // エラー出力 const plumber = require('gulp-plumber'); const notify = require('gulp-notify'); // タスクを順次実行 gulp.task('default', function(callback) { return runSequence(['copy','html','css','image', 'js'], callback); }); ・・・中略・・・ // JavaScriptタスクを生成する gulp.task('js', function(callback) { return runSequence(['js-browserify', 'js-uglify'], callback); }); gulp.task('js-browserify', function() { return config.js.concat.forEach(function(item) { browserify ( { entries: item.source, extensions: ['.js'] } ) .bundle() .on('error', function(e){ console.log(e); }) .pipe(source(item.publish)) .pipe(gulp.dest('dist/js/')) }); }); gulp.task('js-uglify', function() { // ファイルを取得 return ( gulp.src(['./dist/js/**/*.js']) // コンパイルを実行 .pipe(plumber( { errorHandler: notify.onError('<%= error.message %>') } )) .pipe(babel({ presets: ['@babel/preset-env'] })) .pipe(uglify()) .on('error', function(e){ console.log(e); }) // フォルダ以下に保存 .pipe(gulp.dest('dist/js/')) ); }); ・・・中略・・・
config.js
module.exports = { js: { concat: [ { source: [ 'assets/library/js/target/index.js', 'assets/library/js/unit/_smooth-scrolling.js' ], publish: 'index.js' } ] } };
開発環境
OS
windows10
gulp
CLI version 3.9.1
Local version 3.9.1
Node.js
v8.9.4
回答1件
あなたの回答
tips
プレビュー