используя grunt для последовательного объединения файлов

я новичок в grunt, и я хочу объединить файлы java-скриптов в один файл, используя grunt, и у меня есть 6 файлов js, но они должны быть в некоторой последовательности, чтобы запустить код без ошибок, например, jquery должен загружаться первым, но файл результата, который пришел из grunt, не сохранил эту последовательность, я пробовал много вещей, например, упорядочить их в src или создать более одной папки, но это не сработало

примечание: когда я делаю ручную конкатенацию в одном файле путем копирования и вставки, он работает нормально, поэтому есть ли какая-либо команда, позволяющая grunt объединить эти файлы в той последовательности, в которой я написал их в src, например, это тоже мой gruntfile.js

module.exports = function(grunt) {

  // 1. All configuration goes here
  grunt.initConfig({
    pkg: grunt.file.readJSON('package.json'),




    // 1 - this is contecnate js files call them in one file only
    concat: {
      options: {
        separator: ';',
      },
      dist: {
        src: ['src/public/js/jquery.min.js','src/public/js/bootstrap.js','public/js/modernizr.custom.77555.js',
          'public/js/jquery.magnific-popup.js',
     'public/js/jquery.mixitup.min.js','public/js/popup-box.js' ],
        dest: 'dist/1newbuilt.js',
      },
    },



    uglify: {
      build: {
        src: 'dist/1newbuilt.js',
        dest: 'dist/1newbuilt.min.js'
      }
    }


  });

  // end 1 - this is contecnate js files call them in one file only







  // 3. Where we tell Grunt we plan to use this plug-in.
  grunt.loadNpmTasks('grunt-contrib-concat');
  grunt.loadNpmTasks('grunt-contrib-uglify');

  // 4. Where we tell Grunt what to do when we type "grunt" into the terminal.
  grunt.registerTask('default', ['concat', 'uglify']);

};

мне нужно, чтобы файлы были объединены в некотором порядке, например, сначала добавьте 1.js, а затем добавьте 2.js после него, поэтому я написал файлы последовательно, но этот способ тоже не сработал —


person Community    schedule 13.12.2014    source источник


Ответы (2)


Если вы хотите продолжать использовать grunt-contrib-concat и явно вручную указывать свои источники, как у вас, это должно работать. В каком порядке вы видите модули? Вы удалили опцию uglify и просто использовали опцию concat? Этот конфиг grunt корректно расставляет объединенные скрипты по порядку.

module.exports = function(grunt) {
// 1. All configuration goes here
  grunt.initConfig({




    // 1 - this is contecnate js files call them in one file only
    concat: {
      options: {
        separator: ';',
      },
      dist: {
        src: ['a.js','b.js'],
        dest: 'built.js',
      },
    }
  });

  // end 1 - this is contecnate js files call them in one file only
// 3. Where we tell Grunt we plan to use this plug-in.
  grunt.loadNpmTasks('grunt-contrib-concat');


  // 4. Where we tell Grunt what to do when we type "grunt" into the terminal.
  grunt.registerTask('default', ['concat']);

}

это дает такой результат-

(function(){
    console.log("module a");
})();
;(function(){
    console.log("module b");
})();

Кроме того, только ради стилей я не вижу необходимости в разделителе с запятой. Еще один незапрошенный совет: если вам действительно нужно указать порядок зависимостей в ваших JS-файлах, вам следует перейти к использованию загрузчика модулей, такого как RequireJS, Browserify или Модули ES6 (с каким-то транспилером)

person thebringking    schedule 13.12.2014
comment
спасибо за ваш комментарий и фрагмент кода, просмотрев его, я обнаружил, что при вызове файлов java-скрипта в двух файлах возникает ошибка, начинающаяся с src/pu.. что вообще не нужно, и после этого напишите правильный src, поэтому я не не обнаружил, что файл результатов не завершен @thebringking - person ; 13.12.2014
comment
webpack также отлично подходит для решения такого рода задач стандартизированным способом. - person Andreas; 13.12.2018

вам не нужно писать все ваши JS-файлы. Просто используйте подстановочный знак.

concat: {
      js: {
        src: 'src/public/js/*.js',
        dest: 'dest/js/concat.js'
      },

Ваша минимальная задача

 min: {
      js: {
        src: 'dest/js/concat.js',
        dest: 'dest/js/concat.min.js'
      }
    },
person AngularLover    schedule 13.12.2014
comment
мне нужно, чтобы файлы были объединены в некоторых порядках, например, сначала добавьте 1.js, а затем добавьте 2.js после него, поэтому я написал их последовательно, но этот способ тоже не работал для меня. - person ; 13.12.2014
comment
grunt.loadNpmTasks('grunt-contrib-concat'); Это выполнит ваши приказы. просто используйте это расширение. - person AngularLover; 13.12.2014