Grunt + require.jsconfiguration一个简单的网站

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

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文件和其他文件，只是要复制到生成文件夹。 如何为此任务编写grunt.jsconfiguration？ 看来我应该使用grunt-contrib-require ..

第二个问题是如何将1.html和2.html（我使用require text！插件）编译成每行一行，并包含这些行以构build/ js / main.js？ 这种情况下应该只有两个文件到生成文件夹 – index.html和main.js.

Answer 1

Grunt网站提供了一个非常好的教程，让你开始，这是你将需要：

• grunt-contrib-concat – 将文件放在一起
• grunt-contrib-copy – 将文件复制到“build”文件夹
• grunt-usemin – 在你的html中使用编译后的js文件

我不知道如何将这些HTML文件放在一起，感觉很奇怪，但也许你可以find一个插件。

Answer 2

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

Answer 3

你的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时， Require-js会很有帮助。 如果是这种情况，请在pkg: grunt.file.readJSON('package.json'),下面的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" } } } 

Answer 4

你可以考虑在luschn放在一起的列表中joingrunt-require 。 它使用r.js，有很多的select，是相当不错的。