如何根据项目中的实际twig文件创建数据列表

Question

我正在使用https://www.npmjs.com/package/grunt-twig-render通过NPM创建一个应用程序。它本质上是twig.js.我保持苗条，所以现在没有任何其他PHP或类似的东西。只有npm / twig.js和其他npm包，包括Grunt。

这就是我想要做的。现在，我在目录的子文件夹中有一堆twig文件。

我想要做的是生成该子目录中.twig文件的数据列表。这样的事可能会很好

files: [
{
"name": "file1.twig"
"path": "/folder1"
},
{
"name": "file2.twig"
"path": "/folder1"
},
{
"name": "file3.twig"
"path": "/folder1"
}
]

但我并不挑剔。只是看看是否有人找到了通过npm，twigjs或类似方法在文件夹中创建文件列表的方法。

如果它生成.json文件，那将是理想的。这将是构建过程的一部分，因此通过Grunt这样做也会很好。

先感谢您

Answer 1

您可以在custom grunt task中注册Gruntfile.js，它利用shelljs find方法检索每个.twig文件的路径。

shelljs是一个为Node.js提供可移植Unix shell命令的软件包。它的find方法类似于Bash find命令。

以下步骤描述了如何实现您的要求：

1. cd到你的项目目录并运行以下命令安装shelljs： npm i -D shelljs
2. 按如下方式配置Gruntfile.js： Gruntfile.js

   module.exports = function(grunt) {
   
     // requirements
     var path = require('path'),
       find = require('shelljs').find;
   
     grunt.initConfig({
       // other tasks ...
     });
   
     /**
      * Custom grunt task generates a list of .twig files in a directory
      * and saves the results as .json file.
      */
     grunt.registerTask('twigList', 'Creates list of twig files', function() {
       var obj = {};
   
       obj.files = find('path/to/directory')
           .filter(function(filePath) {
             return filePath.match(/\.twig$/);
           })
           .map(function(filePath) {
             return {
               name: path.basename(filePath),
               path: path.dirname(filePath)
             }
           });
   
       grunt.file.write('twig-list.json', JSON.stringify(obj, null, 2));
     });
   
     grunt.registerTask('default', ['twigList']);
   };

Explanation

1. shelljs和节点内置的path模块都是required到Gruntfile.js。
2. 接下来，注册了名为twigList的自定义任务。 在函数体中，我们初始化一个空对象并将其分配给名为obj的变量。 接下来，调用shelljs find方法，将路径传递给包含.twig文件的子目录。目前路径设置为path/to/directory，因此您需要根据需要重新定义此路径。 注意：find方法也可以接受多个目录路径的数组作为参数。例如： find(['path/to/directory', 'path/to/another/directory']) find方法返回在给定目录中找到的所有路径的数组（深层次）。我们通过向字符串filter()方法提供正则表达式（return），使用Array的.twig方法来\.twig$只有match文件扩展名的文件路径。 生成的.twig文件路径数组的每个项目都传递给Array的map()方法。它returns是一个具有两个属性的对象（name和path）。使用节点name方法从完整文件路径获取path.basename()属性的值。类似地，path属性的值是使用节点path.dirname()方法从完整文件路径获得的。 最后，使用grunt file.write()方法将.json文件写入磁盘。目前第一个参数设置为twig-list.json。这将导致名为twig-list.json的文件保存到Gruntfile.js所在的项目目录的顶层。您需要根据需要重新定义此输出路径。第二个参数是通过利用JSON.stringify()将obj转换为JSON来提供的。生成的JSON缩进两个空格。

Additional info

如前所述，shelljs find方法列出给定目录路径中的所有文件（多个级别）。如果提供的目录路径包含一个包含要排除的.twig文件的子文件夹，则可以在filter()方法中执行以下操作：

.filter(function(file) {
    return filePath.match(/\.twig$/) && !filePath.match(/^foo\/bar/);
})

这将匹配所有.twig文件，并忽略给定目录的子目录foo/bar中的文件，例如path/to/directory。