How do I generate a list of files in html, using a grunt task?

问题

I am using yeoman, grunt and angularjs and am new to grunt.

I have some content generation that produces something like this, already copied to the dist folder.

/dist/whatever/x/a.html
/dist/whatever/y/b.html
/dist/whatever/x/c.html

I would like to create another html file using a grunt task:

/dist/whatever/index.html

Which contains:

...
<a href="x/a.html">x</x>
<a href="y/b.html">x</x>
<a href="x/c.html">x</x>
...

This html file can exist in my /app folder as a template, and have grunt replace some tokens.

Is there an existing module that does anything like this (looking for files matching a pattern and writing them into existing content)?

solution based on Matt's comment to use grunt-include-source:

Gruntfile.js:

includeSource: {
  options: {
    basePath: 'dist/whatever',
    baseUrl: '',
    templates: {
      html: {
        link: '<li><a href="{filePath}">{filePath}</a></li>'
      }
    }
  },
  whateverIndex: {
    files: {
      'dist/whatever/index.html': 'app/whatever/index.template.html'
    }
  }
},

app/whatever/index.template.html

<ul>
<!-- include: "type": "link", "files": "*/index.html" -->
</ul>

回答1:

grunt-include-source can be used to build sections in HTML that reference css, js and HTML files in a directory or that match a glob.

The docs on github provide a good overview of how the task is configured and works.

Additionally, the answer to this other question provides a little more info.

来源：https://stackoverflow.com/questions/23402115/how-do-i-generate-a-list-of-files-in-html-using-a-grunt-task

标签

gruntjs