Grunt.js怎样输出并将文件夹内容写入文件？

Question

Grunt.js怎样输出并将文件夹内容写入文件？

node.jsgruntjs

3

目标：

动态包含/static/js/**/*.js和/static/css/**/*.css文件到<head>中。

方法：

我正在使用客户端模板局部，因此在此示例中，我想编写以下内容的所有文件路径：

/static/js/**/*.js 包含到 /templates/head.js.dust
/static/css/**/*.css 包含到 /templates/head.css.dust

当然仅有文件路径是不够的。我需要一种方法来预处理输出，以便每个“文件”都被适当的标记包装，例如：

<!-- /templates/head.js.dust -->
<script src="/static/js/assests/jquery.js"></script>
<script src="/static/js/assests/jquery_ui.js"></script>
<script src="/static/js/app.js"></script>
...

<!-- /templates/head.css.dust -->
<link src="/static/css/assests/jquery_ui.css"/>
<link src="/static/css/app.css"/>
...

问题:

是否有一个grunt模块已经实现了类似这样的功能?

额外加分: 如果没有，我该如何开始构建这样的模块呢?

- Dan Kanze

1个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- gustavohenke · Accepted Answer

您可以通过相对简单的方式来实现：

grunt.registerMultiTask("assetAppend", "Append JS/CSS assets to a file", function() {
    var paths = grunt.file.expand( this.data.paths ),
        out = this.data.output,
        contents = "";

    paths.forEach(function( path ) {
        if ( /\.js$/i.test( path ) ) {
            contents += '<script src="' + path + '"></script>';
        } else if ( /\.css$/i.test( path )) {
            contents += '<link rel="stylesheet" type="text/css" href=' + path + ' />';
        }
    });

    grunt.file.write( out, contents );
});

grunt.initConfig({
    assetAppend: {
        js: {
            paths: ["static/js/**/*.js"],
            output: "head.js.dust"
        },
        css: {
            paths: ["static/css/**/*.css"],
            output: "head.css.dust"
        }
    }
});

这个例子现在已经成为我的插件grunt-contrib-assetpush的一部分。