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

Question

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

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

我想做的是生成该子目录中 .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 in your Gruntfile.js which utilizes the shelljs find方法来检索每个.twig文件的路径。

shelljs is a package which provides portable Unix shell commands for Node.js. It's find method is analogous to the Bash find命令。

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

cd 到您的项目目录并通过运行:
安装 shelljs
```
npm i -D shelljs
```

按如下方式配置您的 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']);
};

说明

shelljs和节点内置path模块都required到Gruntfile.js.
接下来注册名为 twigList 的自定义任务。
- 在函数体中我们初始化一个空对象并将其赋值给一个名为obj.
- 接下来，调用 shelljs find 方法，传入包含 .twig 文件的子目录的路径。当前路径设置为 path/to/directory 因此您需要根据需要重新定义此路径。
  
  注意： find 方法也可以接受多个目录路径的数组作为参数。例如：
```
find(['path/to/directory', 'path/to/another/directory'])
```
- find 方法 returns 在给定目录中找到的所有路径的数组（许多级别深）。我们利用 Array 的 filter() method to return only filepaths with a .twig file extension by providing a regex (\.twig$) to the Strings match 方法。
- 生成的 .twig 文件路径数组的每一项都传递给数组的 map() method. It returns an Object with two properties (name and path). The value for the name property is obtained from the full filepath using nodes path.basename() method. Similarly, the value for the path property is obtained from the full filepath using nodes path.dirname() 方法。
- 最后 grunt file.write() method is utilized to write a .json file to disk. Currently the first argument is set to twig-list.json. This will result in a file named twig-list.json being saved to the top-level of your project directory where Gruntfile.js resides. You'll need to redefine this output path as necessary. The second argument is provided by utilizing JSON.stringify() 将 obj 转换为 JSON。结果 JSON 缩进了两个空格。

附加信息

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

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

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

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

How do I create a list of data based on actual twig files within project

npm

gruntjs

说明

附加信息