@loicpetitdev/gulp-data-json v1.0.0
gulp-data-json
NPM package to provide data to gulp-data from json files.
Install
Install the npm package :
npm install --save-dev @loicpetitdev/gulp-data-json
Usage
The package must be used with gulp and gulp-data packages.
Example
gulp-compile-handlebars package supports gulp-data plugin to inject data in the handlebars templates. Get HTML files from src/pages, then used gulp-data to loop through each file. Use the gulp-data-json function to get the JSON associated file of each HTML file, then gulp-data module will give these data to the next plugin : gulp-compile-handlebars.
By default, each JSON file must be at the same location with the same name of the associated HTML file. The JSON file is optionnal. Exemple :
- src
- pages
- index.html
- index.json
- about.html
- pages
Only index.html will get data.
The globalData object is for the gulp-compile-handlebars module which enable to inject in every page global data, merged with data from the JSON if existing.
// in gulpfile.js
const { src, dest, series, parallel, watch } = require('gulp')
const data = require('gulp-data')
const jsondata = require('./scripts/gulp-data-json')
const handlebars = require('gulp-compile-handlebars')
function compile(){
// default json data options
const jsonDataOptions = {
debug: false,
src: null,
relativeFrom: null
}
// handlebars global data
const globalData = {
debug: false,
title: "Handlebars"
}
// handlebars options
const handlebarsOptions = {
batch: ['src/partials']
}
// task
return src('src/pages/*.html')
.pipe(data(jsondata(jsonDataOptions)))
.pipe(handlebars(globalData, handlebarsOptions))
.pipe(dest('dist'))
}
Debug option
{debug: true} is used to display log in order to see what happened in the module.
Src option
{src: '/my/path'} is used to search JSON files in the folder /my/path instead of next the file.
Example :
- project
- templates
- file1.html
- sub
- file2.html
- json
- file1.json
- file2.json
- templates
Files with same name will use the same json file !
RelativeFrom option
required src option
To avoid having several files with the same to use the same json file in the src directory, use relativeFrom option.
In the folloing example, src is json and relativeFrom is templates :
- project
- templates
- file1.html
- sub
- file2.html
- json
- file1.json
- sub
- file2.json
- templates
Repository
src contains the module code. Unit tests are spec files.
test contains integration tests.
.vscode contains the Visual Studio Code configuration to debug tests.
NPM package
There are only development dependencies to test the module.
Scripts
- test:unit runs the unit tests
- test:int runs the integration tests
- test runs all tests
- watch:unit watch adn runs the unit tests
- watch:int watch and runs the integration tests
- watch watch and runs all tests
- debug is used to debug the tests, used in the Visual Studio Code configuration