Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

https://github.com/haoxins/gulp-file-include

MAINTAINER WANTED ~ [gulp-file-include] a gulp plugin for file include
https://github.com/haoxins/gulp-file-include

Last synced: 3 months ago
JSON representation

MAINTAINER WANTED ~ [gulp-file-include] a gulp plugin for file include

Host: GitHub
URL: https://github.com/haoxins/gulp-file-include
Owner: haoxins
License: mit
Created: 2014-01-06T03:35:43.000Z (over 10 years ago)
Default Branch: main
Last Pushed: 2022-02-27T16:00:36.000Z (over 2 years ago)
Last Synced: 2024-03-23T21:04:07.190Z (3 months ago)
Language: JavaScript
Homepage:
Size: 139 KB
Stars: 672
Watchers: 18
Forks: 94
Open Issues: 72
Metadata Files:
- Readme: Readme.md
- License: LICENSE

Lists

awesome-gulp-cn - gulp-file-include - 通过Gulp Include文件. (插件 / 其他插件)
awesome-stars - gulp-file-include - MAINTAINER WANTED ~ [gulp-file-include] a gulp plugin for file include (JavaScript)

README

        [![NPM version][npm-img]][npm-url]

[![Build status][travis-img]][travis-url]

[![Test coverage][coveralls-img]][coveralls-url]

[![License][license-img]][license-url]

[![Dependency status][david-img]][david-url]

[![Gitter][gitter-img]][gitter-url]

# gulp-file-include

a [gulp](https://github.com/gulpjs/gulp) plugin for file includes

## Installation

```bash

npm install --save-dev gulp-file-include

```

## API

```js

const fileinclude = require('gulp-file-include');

```

### fileinclude([prefix])

#### prefix

Type: `string`


Default: `'@@'`

### fileinclude([options])

#### options

Type: `object`

##### options.prefix

Type: `string`


Default: `'@@'`

##### options.suffix

Type: `string`


Default: `''`

##### options.basepath

Type: `string`


Default: `'@file'`

Possible values:

  - `'@file'`:  include file relative to the dir in which `file` resides ([example](#include-options---type-json))

  - `'@root'`: include file relative to the dir in which `gulp` is running

  - `path/to/dir`: include file relative to the basepath you provide

##### options.filters

Type: `object`


Default: `false`

Filters of include content.

##### options.context

Type: `object`

Default: `{}`

Context of `if` statement.

##### options.indent

Type: `boolean`

Default: `false`

## Examples

### @@include options - type: `JSON`

index.html

```html

  

  @@include('./view.html')

  @@include('./var.html', {

    "name": "haoxin",

    "age": 12345,

    "socials": {

      "fb": "facebook.com/include",

      "tw": "twitter.com/include"

    }

  })

  

```

view.html

```html

view

```

var.html

```html

@@name

@@age

@@socials.fb

@@socials.tw

```

gulpfile.js

```js

const fileinclude = require('gulp-file-include');

const gulp = require('gulp');

gulp.task('fileinclude', function() {

  gulp.src(['index.html'])

    .pipe(fileinclude({

      prefix: '@@',

      basepath: '@file'

    }))

    .pipe(gulp.dest('./'));

});

```

result:

```html

  

  
view

  haoxin

12345

facebook.com/include

twitter.com/include

  

```

### @@include_once options - type: `JSON`

index.html

```html

  

  @@include_once('./view.html')

  @@include_once('./var.html', {

    "name": "haoxin",

    "age": 12345,

    "socials": {

      "fb": "facebook.com/include",

      "tw": "twitter.com/include"

    }

  })

  @@include_once('./var.html', {

    "name": "haoxin",

    "age": 12345,

    "socials": {

      "fb": "facebook.com/include",

      "tw": "twitter.com/include"

    }

  })

  

```

view.html

```html

view

```

var.html

```html

@@name

@@age

@@socials.fb

@@socials.tw

```

gulpfile.js

```js

const fileinclude = require('gulp-file-include');

const gulp = require('gulp');

gulp.task('fileinclude', function() {

  gulp.src(['index.html'])

    .pipe(fileinclude({

      prefix: '@@',

      basepath: '@file'

    }))

    .pipe(gulp.dest('./'));

});

```

result:

```html

  

  
view

  haoxin

12345

facebook.com/include

twitter.com/include

  

```

### filters

index.html

```html

  

  @@include(markdown('view.md'))

  @@include('./var.html', {

    "name": "haoxin",

    "age": 12345

  })

  

```

view.md

```html

view

====

```

gulpfile.js

```js

const fileinclude = require('gulp-file-include');

const markdown = require('markdown');

const gulp = require('gulp');

gulp.task('fileinclude', function() {

  gulp.src(['index.html'])

    .pipe(fileinclude({

      filters: {

        markdown: markdown.parse

      }

    }))

    .pipe(gulp.dest('./'));

});

```

### `if` statement

index.html

```

@@include('some.html', { "nav": true })

@@if (name === 'test' && nav === true) {

  @@include('test.html')

}

```

gulpfile.js

```js

fileinclude({

  context: {

    name: 'test'

  }

});

```

### `for` statement

index.html

```html



@@for (var i = 0; i < arr.length; i++) {

  `+arr[i]+`

}



```

gulpfile.js

```js

fileinclude({

  context: {

    arr: ['test1', 'test2']

  }

});

```

### `loop` statement

index.html

```html

  @@loop('loop-article.html', [

    { "title": "My post title", "text": "
lorem ipsum..." },

    { "title": "Another post", "text": "lorem ipsum..." },

    { "title": "One more post", "text": "lorem ipsum..." }

  ])

```

loop-article.html

```html

  
@@title

  @@text

```

### `loop` statement + `data.json`

data.json

```js

[

  { "title": "My post title", "text": "
lorem ipsum..." },

  { "title": "Another post", "text": "lorem ipsum..." },

  { "title": "One more post", "text": "lorem ipsum..." }

]

```

loop-article.html

```html

  @@loop("loop-article.html", "data.json")

```

### `webRoot` built-in context variable

The `webRoot` field of the context contains the relative path from the source document to

the source root (unless the value is already set in the context options).

support/contact/index.html

```html

  

    

  

  

    
Support Contact Info

    Home

  

  

    
Support Contact Info

    Home