使用 grunt 编译和合并 coffeescript 和 javascript答案

【问题标题】：Compile and merge coffeescript and javascript using grunt使用 grunt 编译和合并 coffeescript 和 javascript
【发布时间】：2013-11-19 13:36:47
【问题描述】：

我已经包含了一个用 Javascript 编写的库，并且还有一些依赖于这些库的咖啡脚本代码。

当我使用 GRUNT 发布时，我想创建一个 Javascript 文件，该文件是通过将所有 JS 和 Coffee 文件组合在一起制作的。显然grunt-contrib-uglifyjs 和Grunt-contrib-coffee 都不支持这种行为。这个问题的解决方法是什么？

【问题讨论】：

我回答你的问题了吗？

标签： javascript coffeescript gruntjs uglifyjs

【解决方案1】：

您可以使用concat 来执行此操作。

例如，在您的Gruntfile.js:

module.exports = function(grunt) {
  return grunt.initConfig({
    pkg: grunt.file.readJSON('package.json'),
    // EDIT: TO COMPILE YOUR COFFEESCRIPT
    coffee: {
      "default": {
        src: paths.coffee_src,
        dest: paths.js_dir,
        options: {
          preserve_dirs: true,
          base_path: paths.coffee_dir
        }
      }
    },
    concat: {
      options: {
        separator: ';'
      },
      dist: {
        src: ['assets/javascripts/libs/underscore/underscore.js', 'assets/javascripts/libs/jquery/jquery.js', 'assets/javascripts/libs/json2/json2.js', 'assets/javascripts/libs/handlebars-wycats/dist/handlebars.js', 'assets/javascripts/libs/backbone/backbone.js', 'assets/javascripts/libs/marionette/lib/backbone.marionette.js', 'assets/javascripts/*.js', 'assets/javascripts/utilities/*.js', 'assets/javascripts/models/*.js', 'assets/javascripts/collections/*.js', 'assets/javascripts/modules/**/**/*.js'],
        dest: '<%= pkg.name %>.js'
      }
    },
    // ...
    // EDIT: TO MINIFY YOUR CONCATENATED JS
    uglify: {
      options: {
        banner: '/*! <%= pkg.name %> <%= grunt.template.today("dd-mm-yyyy") %> */\n'
      },
      dist: {
        files: {
          '<%= pkg.name %>.min.js': ['<%= concat.dist.dest %>']
        }
      }
    },
    // ...

在这里，我按该顺序连接所有文件（以 underscore.js 开头），因此，您将拥有一个包含所有这些文件的单个 js 文件，按照您想要的特定顺序。

查看this documentation了解更多信息。

【讨论】：

这不会缩小或混淆输出文件。此外，它不适用于咖啡脚本。
请检查我更新的答案。您必须先使用coffee 在js 中编译coffeescript，然后使用concat 连接您的js 和编译后的coffeescript 文件，然后使用uglify 将其缩小。
您是在将咖啡文件编译到临时位置，然后将它们与已经存在的 js 文件合并吗？
你可以随意选择，不一定是临时文件夹。您可以创建一个编译文件目录，然后使用.gitignore 忽略它
这就是我现在正在做的事情。如果有一个插件可以一次性完成同样的事情，那就更好了。

【解决方案2】：

Grunt 是一个 nodejs 文件，并像 nodejs 一样执行。所以试试这个：

require('child_process').exec('coffee --compile --output lib/ src/',  function () {
    /*add callback or use execSync */
});

只需编辑咖啡命令。

【讨论】：

如何将它们与 javascript 文件合并？
并以grunt-contrib-concat为例concat编译的js文件。