1

我是 grunt 的新手，我想使用 grunt 将 java 脚本文件连接到一个文件，我有 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，所以我按顺序编写文件，但这种方式也行不通 –</p>

4

2 回答 2

3

如果您想继续使用 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 Modules（带有某种转译器）

于 2014-12-13T02:14:17.033 回答
0

您不必编写所有的 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'
      }
    },
于 2014-12-13T01:56:01.727 回答