这里的gulp菜鸟,我看到了gulp-uglify的奇怪行为。
这是我的任务:
var gulp = require ("gulp");
var util = require ("gulp-util");
var clean = require ("gulp-clean");
var cleanCSS = require ("gulp-clean-css");
var debug = require ("gulp-debug");
var filesize = require ("gulp-filesize");
var rename = require ("gulp-rename");
var sass = require ("gulp-ruby-sass");
var browserify = require (BROWSERIFY);
var source = require ("vinyl-source-stream");
var buffer = require ("vinyl-buffer");
var sourceMaps = require("gulp-sourcemaps");
var babelify = require ("babelify");
var uglify = require ("gulp-uglify");
var concatFileNames = require ("gulp-concat-filenames");
var header = require ("gulp-header");
function browserifyTask () {
return browserify ("./app/main.js")
.transform(babelify)
.bundle()
.pipe (source("main.js"))
.pipe (buffer())
.pipe (sourceMaps.init({loadMaps: true}))
.pipe (sourceMaps.write("./")) // Ensure the source map gets written
.pipe (gulp.dest("./public/js"))
// Now do production build stuff
.pipe (rename("main.min.js"))
.pipe (sourceMaps.init({loadMaps: true}))
.pipe (uglify().on ("error", util.log))
.pipe (sourceMaps.write("./")) // Ensure the source map gets written
.pipe (gulp.dest("./public/js"))
}
这个想法是产生普通的(非缩小的)JS和一个缩小的版本。
但是,Uglify 抛出了一个错误:
[16:20:26] Using gulpfile C:playuntitledgulpfile.js
[16:20:26] Starting 'browserify'...
[16:20:28] { [Error: C:playuntitledpublicjsmain.min.js: Unexpected token: punc (:)]
message: 'C:\play\untitled\public\js\main.min.js: Unexpected token: punc (:)',
fileName: 'C:\play\untitled\public\js\main.min.js',
lineNumber: 1,
stack: 'Errorn at new JS_Parse_Error (eval at <anonymous> (C:\play\untitled\node_modules\uglify-js\tools\node.js:22:1), <anonymous>:1526:18)n at js_error (eval at <anonymous> (C:\play\untitled\node_modules\uglify-js\tools\node.js:22:1), <anonymous>:1534:11)n at croak (eval at <anonymo
us> (C:\play\untitled\node_modules\uglify-js\tools\node.js:22:1), <anonymous>:2026:9)n at token_error (eval at <anonymous> (C:\play\untitled\node_modules\uglify-js\tools\node.js:22:1), <anonymous>:2034:9)n at unexpected (eval at <anonymous> (C:\play\untitled\node_modules\uglify-js\tool
s\node.js:22:1), <anonymous>:2040:9)n at semicolon (eval at <anonymous> (C:\play\untitled\node_modules\uglify-js\tools\node.js:22:1), <anonymous>:2060:56)n at simple_statement (eval at <anonymous> (C:\play\untitled\node_modules\uglify-js\tools\node.js:22:1), <anonymous>:2240:73)n at ev
al (eval at <anonymous> (C:\play\untitled\node_modules\uglify- js\tools\node.js:22:1), <anonymous>:2093:47)n at eval (eval at <anonymous> (C:\play\untitled\node_modules\uglify-js\tools\node.js:22:1), <anonymous>:2073:24)n at block_ (eval at <anonymous> (C:\play\untitled\node_modules\ugli
fy-js\tools\node.js:22:1), <anonymous>:2353:20)',
showStack: false,
showProperties: true,
plugin: 'gulp-uglify' }
似乎它不喜欢它正在管道传输的 JS 的某些内容,但如果在第一次 gulp.dest() 调用之前调用它,Uglify 不会抛出错误(我确实得到了缩小的代码)。
这篇文章表明源映射可能是一个问题,并使用gulp-ignore 来排除它们。试过了,没有用;同样的错误。
我在这里错过了一些明显的东西吗?
谢谢杰夫
所以是源地图导致Uglify犹豫不决。将 Browserify 与其他插件相结合似乎存在一个更普遍的问题,这与 Browserify 想要在缓冲区中的内容和其他插件想要在流中的东西有关。
为此,我重新找到了我的任务功能:
function browserifyTask () {
function doBrowserify (isProduction) {
browserify ("./app/main.js")
.transform(babelify)
.bundle()
.pipe (source("main.js"))
.pipe (isProduction ? rename("main.min.js") : util.noop())
.pipe (buffer())
.pipe (sourceMaps.init({loadMaps: true}))
.pipe (isProduction ? uglify().on ("error", util.log) : util.noop())
.pipe (sourceMaps.write("./"))
.pipe (gulp.dest("./public/js"))
}
doBrowserify(false);
doBrowserify(true);
}
没有我想要的那么优雅,但它完成了工作,我需要继续这个项目(而不是在构建过程中陷入困境)。