gulp-directory-map

Convert a buffer of files into a JSON representation of the directory structure using gulp

Usage

First, install gulp-directory-map as a development dependency:

npm install --save-dev gulp-directory-map

Then, add it to your gulpfile.js:

var directoryMap = require("gulp-directory-map");
  
gulp.src('app/**/*.html')
  .pipe(directoryMap({
    filename: 'urls.json'
  }))
  .pipe(gulp.dest('dist'));
 

Given this directory structure...

app
  |_nested-folder-1
    |_nested-folder-1-1
      |_index.html
    |_faq.html
    |_index.html
  |_nested-folder-2
    |_nested-folder-2-1
      |_index.txt
    |_index.html
  |_index.html
  |_index.txt

... this JSON object would be written to dist/urls.json:

{
  "index.html": "index.html",
  "nested-folder-1": {
    "faq.html": "nested-folder-1/faq.html",
    "index.html": "nested-folder-1/index.html",
    "nested-folder-1-1": {
      "index.html": "nested-folder-1/nested-folder-1-1/index.html"
    }
  },
  "nested-folder-2": {
    "index.html": "nested-folder-2/index.html"
  }
}

This is useful for mapping out a directory structure after passing files through a pre-processor, generating data to create navigation during build, and more. Have fun!

API

directory-map(options)

options.filename

Type: String
Default: urls.json

The path to write the directory structure JSON file to.

options.prefix

Type: String Default: none

The a string to prepend to every url.

Given the directory structure above, specifiying prefix: 'prefixed-folder' would generate this JSON:

{
  "prefixed-folder": {
    "index.html": "prefixed-folder/index.html",
    "nested-folder-1": {
      "faq.html": "prefixed-folder/nested-folder-1/faq.html",
      "index.html": "prefixed-folder/nested-folder-1/index.html",
      "nested-folder-1-1": {
        "index.html": "prefixed-folder/nested-folder-1/nested-folder-1-1/index.html"
      }
    },
    "nested-folder-2": {
      "index.html": "prefixed-folder/nested-folder-2/index.html"
    }
  }
}

License

MIT License

Thanks

Thanks to @hparra for creating the generator-gulp-plugin. It has lots of great examples and boilerplate setup, and was used to get this plugin bootstrapped.