6

我的网站有以下简单结构:

src
  js
    core.js
    main.js
  lib
    jquery-1.8.2.js
    require-2.1.1.js
    require-text.js
  templates
    1.html
    2.html
  index.html
build

我希望将所有 js+lib 文件编译成一个 build/js/main.js 文件,而其他文件只需复制到 build 文件夹。如何为此任务编写 grunt.js 配置?看来我应该使用 grunt-contrib-require..

第二个问题是如何将 1.html 和 2.html(我使用 require text!插件)分别编译成一行并将这些行包含到 build/js/main.js 中?在这种情况下,构建文件夹中应该只有两个文件 - index.html 和 main.js。

4

4 回答 4

9

看看grunt-contrib-requirejs看看它是否对你有帮助。

于 2013-10-22T01:58:16.997 回答
5

Grunt 网站提供了一个非常好的教程来帮助您入门,这就是您所需要的:

我不确定如何将这些 html 文件放在一起,这样做感觉很奇怪,但也许你可以找到一个插件。

于 2013-10-21T20:21:30.610 回答
5

Gruntfile.js应该位于目录的根目录,即ls should show src/ build/ Gruntfile.js

具体内容`Gruntfile.js满足您的要求:

module.exports = function (grunt) {
    grunt.initConfig({
        pkg: grunt.file.readJSON('package.json'),
        concat: {

            js: {
                src: [
                    'src/js/*', 'src/lib/*'
                ],
                dest: 'build/js/combined.js'
            }
        },
        uglify: {
            js: {
                files: {
                    'build/js/main.js': ['build/js/combined.js']
                }
            }
        },
    });
    grunt.loadNpmTasks('grunt-contrib-concat');
    grunt.loadNpmTasks('grunt-contrib-uglify');
    grunt.registerTask('default', ['concat:js', 'uglify:js']);
};

我不认为require-js在这里被使用。Require-js当您需要按js scripts特定顺序加载时很有帮助。如果是这种情况,请Gruntfile.js在下面的pkg: grunt.file.readJSON('package.json'),行中添加以下代码

requirejs: {
  compile: {
    options: {
      baseUrl: "path/to/base",
      mainConfigFile: "path/to/config.js",
      name: "path/to/almond", // assumes a production build using almond
      out: "path/to/optimized.js"
    }
  }
}
于 2014-03-03T20:02:01.877 回答
0

您可以考虑将grunt-require添加到 luschn 放在一起的列表中。它使用 r.js,有很多选择,而且非常好。

于 2014-01-09T21:24:47.623 回答