Question

我使用gulp使用 gulp-concat 和 gulp-uglify 构建单个javascript文件。

原始文件

//File 1
var Proj = Proj || {};

//File 2
Proj.Main = (function() { 
    var Method = function(){ /*Code*/ };
    return { "Method":Method };
})();

//File 3
Proj.Page = (function() { 
    var Method = Proj.Main.Method;
    return { "Method":Method };
})();

Gulp返回一个错误的缩小文件，因为这些文件的连接顺序错误。我知道我可以在.src([])中指定订单，但我不想在添加javascript文件时维护数组。

有没有办法创建对这些＆＃34;命名空间的引用＆＃34;而不必担心连接文件的顺序？或者，有没有办法让gulp自动神奇地处理这些命名空间的知识串联？

编辑：

我知道我可以在.src([])内指定文件顺序。我想开发而不必担心文件顺序，无论是通过gulp包还是javascript框架。感谢您的回复，但我需要一个明确的答案。＃34;不。你不能这样做。＆＃34;或者＆＃34;是的。这里是如何......＆＃34;将线程标记为已回答。

Answer 1

嗯，一个选择是尝试gulp-order。

另外，请查看this answer to "gulp concat scripts in order?"。

基本上，它提到了你已经说过的内容，关于必须按照你希望它们进入的顺序明确命名文件。我知道你不想这样做，但是如果知道哪个命令会怎么做呢你想要你的文件吗？

但有一点值得指出的是，你有一组订单并不重要的文件，然后说明订单重要的2个文件，你可以做这样的事情：

gulp.src([
    'utils/*.js',
    'utils/some-service.js',
    'utils/something-that-depends-on-some-service'
])

gulp-concat不会重复文件，所以不是some-service.js或something-that-depends-on-some-service.js的所有内容都会先连接，然后是最后两个文件将以正确的顺序连接。

Answer 2

由于没有提及，实施webpack或browserify绝对可以解决这个问题，而不会实现某种hacky感觉解决方案。

以下是如何使用它的简单示例：

var source = require('vinyl-source-stream'), //<--this is the key
    browserify = require('browserify');

    function buildEverything(){
        return browserify({
               //do your config here
                entries: './src/js/index.js',
            })
            .bundle()
            .pipe(source('index.js')) //this converts to stream
             //do all processing here.
             //like uglification and so on.
            .pipe(gulp.dest('bundle.js'));
        }
    }

    gulp.task('buildTask', buildEverything);

在文件中，您使用require语句指示哪些文件需要其他文件。

如何使用Gulp或Javascript框架解决Javascript文件顺序？

2 个答案: