2015-05-20 4 views
2

Я использую gulp для создания одного файла javascript с gulp-concat и gulp-uglify.Как вы делаете заказ на Javascript, используя Gulp или Javascript Framework?

Original Files

//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 }; 
})(); 

Глоток возвращает плохой Минимизированный файл, так как эти файлы быть сцеплены в неправильном порядке. Я знаю, что могу указать порядок в .src([]), но я не хочу поддерживать массив, когда добавляю файлы javascript.

Есть ли способ создать ссылки на эти «пространства имен», не беспокоясь о порядке конкатенации файлов? Или, есть ли способ, чтобы глоток обрабатывал конкатенацию с помощью знания этих пространств имен автоматически?

EDIT:

Я знаю, что могу указать порядок файлов внутри .src([]). Я хочу развиваться, не беспокоясь о порядке файлов, будь то через пакет gulp или javascript. Спасибо за ответы, которые помогают, но мне нужен окончательный «Нет. Вы не можете этого сделать». или «Да. Вот как ...», чтобы отметить поток как ответ.

+0

Лично я бы написал javascript по-другому, я бы выбрал событие, как только один скрипт загрузился, чтобы другой скрипт мог выполнить. Кажется, что если два сценария настолько жестко зависимы, они должны управляться по-разному. –

ответ

3

Ну, один из вариантов - попробовать 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' 
]) 

глоток-CONCAT не повторять файлы, так что все, что не some-service.js или something-that-depends-on-some-service.js получит сцепляются, а затем последние два файла будет слита в правильном порядке.

1

Поскольку это не упоминалось, внедрение webpack или браузера решит эту проблему без реализации какого-либо хакерского решения.

Вот простой пример того, как использовать его:

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 заявления, чтобы указать, какие файлы требуют другие.