使用grunt顺序CONCATENATE文件 [英] using grunt to CONCATENATE FILES in sequence

问题描述

我是新来的咕unt声 而且我想使用grunt将Java脚本文件连接到一个文件 我有6个js文件，但它们需要按一定顺序运行代码，而不会出现类似jquery之类的错误 但是来自grunt的结果文件不会保留此序列 我尝试了很多事情，例如将它们安排在src中或制作了多个文件夹，但这没有用

i'm new to grunt and i want to concatenate java script files to one file using grunt and i have 6 js files but they need to be in some sequence to run the code without errors like jquery should loaded in first but the result file which came from grunt not preserve this sequence i tried many things like arrange them in src or make more than one folder but it didn't work

注意-当我通过复制和粘贴在一个文件中进行手动串联时，它可以正常工作 所以有什么命令可以使咕gr声以我在src中将它们写为示例的顺序连接此文件 这也是我的gruntfile.js

note - when i make manual concatenation in one file by copy and paste it works fine so is there any command to make grunt concatenate this files in the secuquence that i wrote them in src as example this is my gruntfile.js too

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 所以我按顺序写了文件，但是这种方式也行不通–

i need the files to be concatenated in some orders like first add 1.js then add 2.js after it so i wrote the files in sequence but this way didn't work too –

推荐答案

如果您想继续使用grunt-contrib-concat，并手动明确地指定源，就像您应该使用的那样.您看到模块的顺序是什么?您是否删除了uglify选项并仅使用了concat选项?此grunt配置正确地将组合的脚本排好序.

If you want to continue to use grunt-contrib-concat, and manually specify your sources explicitly, like you have it should work. What order are you seeing the modules in? Have you removed the uglify option and just used the concat option? This grunt config correctly puts the combined scripts in order.

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']);

}

这会产生类似这样的结果

this produces a result like this-

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

此外，仅出于样式考虑，我认为不需要分号分隔符.如果您确实需要在JS文件中指定依赖项顺序，则另一条未经请求的建议是，您应该使用 RequireJS ，浏览器或

Also, just for styles sake, I don't see a need for a semi-colon separator. Another piece of un-solicited advice if you really need to specify a dependency order in your JS files, you should move towards using a module loader like RequireJS, Browserify, or ES6 Modules (with a transpiler of some sort)

这篇关于使用grunt顺序CONCATENATE文件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！