Coder Social home page Coder Social logo

ltnkshkn / gulp-folder-index Goto Github PK

View Code? Open in Web Editor NEW

This project forked from davesag/gulp-folder-index

0.0 1.0 0.0 7 KB

Gulp plugin to generate folder indexes.

Home Page: https://www.npmjs.com/package/gulp-folder-index

License: MIT License

JavaScript 100.00%

gulp-folder-index's Introduction

gulp-folder-index

NPM version Build Status

Convert a buffer of files into a JSON representation of the directory structure using gulp, with configurable file extension

Usage

First, install gulp-folder-index as a development dependency:

npm install --save-dev gulp-folder-index

Then, add it to your gulpfile.js:

let folderIndex = require("gulp-folder-index");

gulp.src('app/**/*.yml')
  .pipe(folderIndex({
    extension: '.json',       // default
    filename: 'index.json',   // default
    prefix: '',               // default
    directory: false          // default
  }))
  .pipe(gulp.dest('dist'));

Given this directory structure...

app
  | folder-1
    | folder-2
      | something.yml
    | faqs.yml
  | folder-3
    |_folder-4
      | something-else.yml
  | hello-world.yml

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

[
  "hello-world.json",
  "folder-1/faqs.json",
  "folder-1/folder2/something.json",
  "folder-3/folder-4/something-else.json"
]

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

folder-index(options)

options.filename

Type: String
Default: index.json

The path to write the directory structure JSON file to.

options.prefix

Type: String Default: none

A string to prepend to every url.

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

[
  "prefixed-folder/hello-world.json",
  "prefixed-folder/folder-1/faqs.json",
  "prefixed-folder/folder-1/folder2/something.json",
  "prefixed-folder/folder-3/folder-4/something-else.json"
]

options.extension

Type: String Default: json

An extension string to replace the original with.

Given the directory structure above, specifiying extension: 'html' would generate this JSON:

[
  "hello-world.html",
  "folder-1/faqs.html",
  "folder-1/folder2/something.html",
  "folder-3/folder-4/something-else.html"
]

options.directory

Type: Boolean Default: false

An extension boolean to generate json with directory and path.

Given the directory structure above, specifiying directory: true would generate this JSON:

[
  {
    "directory": "",
    "path": "hello-world.json"
  },
  {
    "directory": "folder-1/",
    "path": "folder-1/faqs.json"
  },
  {
    "directory": "folder-1/folder2/",
    "path": "folder-1/folder2/something.json"
  },
  {
    "directory": "folder-3/folder-4/",
    "path": "folder-3/folder-4/something-else.json"
  }
]

License

MIT License

Thanks

Thanks to @masondesu for creating the gulp-directory-map upon which this is based.

gulp-folder-index's People

Contributors

davesag avatar

Watchers

James Cloos avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.