A Terser-js plugin for Gulp
uglify-esis no longer maintained anduglify-jsdoes not support ES6+.
terseris a fork ofuglify-esthat retains API and CLI compatibility withuglify-esanduglify-js@3. Source:Why choose terser?
This plugin displays formatted error:
npm install gulp-terser-js
const terser = require('gulp-terser-js')
const minifyJS = () =>
gulp.src('asset/js/*.js')
.pipe(terser({
mangle: {
toplevel: true
}
}))
.on('error', function (error) {
this.emit('end')
})
.pipe(gulp.dest('public/js/'))
gulp.task('minifyJS', minifyJS)The options you can use can be found here.
const gulp = require('gulp')
const concat = require('gulp-concat')
const sourcemaps = require('gulp-sourcemaps')
const terser = require('gulp-terser-js')
const sourceMapOpt = {
sourceMappingURL: (file) => 'http://127.0.0.1/map/' + file.relative + '.map'
}
const mapsFolder = './public/map'
const minifyJS = () =>
gulp.src('./asset/js/*.js')
.pipe(gulp.dest(mapsFolder))
.pipe(sourcemaps.init())
.pipe(concat('script.js'))
.pipe(terser({
mangle: {
toplevel: true
}
}))
.on('error', function (error) {
if (error.plugin !== "gulp-terser-js") {
console.log(error.message)
}
this.emit('end')
})
.pipe(sourcemaps.write(mapsFolder, sourceMapOpt))
.pipe(gulp.dest('./public/js/'))
gulp.task('minifyJS', minifyJS)When running Terser on compiled Javascript, you may run into issues with source maps.
If you need to pass the content of your source maps to Terser, first you must set the loadMaps option to true when initializing gulp-sourcemaps.
Next, make the content source map option true when piping Terser.
A basic setup may look like this:
gulp.src('asset/js/*.js')
.pipe(sourcemaps.init({ loadMaps: true }))
.pipe(terser({
sourceMap: {
content: true
}
}))
.pipe(sourcemaps.write())
.pipe(gulp.dest('dist'))// ...
const less = require('gulp-less');
const generateCSS = () =>
gulp.src("./asset/css/*.less", srcOptions)
.pipe(less()).on("error", printLESSError)
.pipe(postcss([cssnano]))
.pipe(sourcemaps.write(path.relative(srcOptions.cwd, mapsFolder), sourceMapOpt))
.pipe(gulp.dest(outputBuildFolder))
function printLESSError(error) {
if (error.plugin === "gulp-less") {
terser.printError.call(this, {
name: error.type,
line: error.line,
col: error.column,
filePath: error.filename,
fileContent: '' + fs.readFileSync(error.filename),
message: (error.message || '').replace(error.filename, path.basename(error.filename)).split(' in file')[0],
plugin: error.plugin
})
} else {
console.log(error.message);
}
this.emit('end')
}| Description | gulp-terser-js |
|---|---|
| Node Version | >= 8.10.0 |
| Terser Version | 4.1.4+ |
| Gulp Version | >= 4.X |
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent