https://github.com/mitranim/gulp-html-to-js
Gulp plugin for converting text files to JavaScript modules
https://github.com/mitranim/gulp-html-to-js
Last synced: 8 months ago
JSON representation
Gulp plugin for converting text files to JavaScript modules
- Host: GitHub
- URL: https://github.com/mitranim/gulp-html-to-js
- Owner: mitranim
- Created: 2015-06-29T16:35:24.000Z (over 10 years ago)
- Default Branch: master
- Last Pushed: 2018-08-24T13:53:38.000Z (over 7 years ago)
- Last Synced: 2025-04-26T06:56:56.636Z (9 months ago)
- Language: JavaScript
- Homepage:
- Size: 15.6 KB
- Stars: 4
- Watchers: 2
- Forks: 6
- Open Issues: 1
-
Metadata Files:
- Readme: readme.md
Awesome Lists containing this project
README
## Overview
A [`gulp`](http://gulpjs.com) plugin that converts arbitrary text files into JavaScript modules. Not limited to HTML.
## Installation
```sh
npm i -E gulp-html-to-js
# or
yarn add -E gulp-html-to-js
```
## Usage
In your `gulpfile.js`:
```js
const htmlToJs = require('gulp-html-to-js')
// Without concatenation
gulp.task('html:compile', () => (
gulp.src('src/html/**/*')
.pipe(htmlToJs())
.pipe(gulp.dest('dist'))
))
// With concatenation
gulp.task('html:compile', () => (
gulp.src('src/html/**/*')
.pipe(htmlToJs({concat: 'html.js'}))
.pipe(gulp.dest('dist'))
))
```
Without the `concat` option, each module exports a single string:
```html
Hello world!
```
Becomes:
```js
module.exports = '
Hello world!
'
```
With `concat`, files are grouped into one module, where strings are keyed by file paths:
```js
module.exports = Object.create(null)
module.exports['index.html'] = '
Hello world!
'
```
In your app, import the result like so (directory nesting depends on your build configuration):
```js
import html from './html.js'
// or
const html = require('./html.js')
```
## Options
See the `concat` option above. You can also modify it with:
* `prefix`: Prepends a path prefix to all keys of the resulting module object.
For `{prefix: 'templates'}` the resulting file from the above example is:
```js
module.exports = Object.create(null)
module.exports['templates/index.html'] = '
Hello world!
'
```
* `global`: Requires `concat`. Assigns the resulting object to some global identifier other than `module.exports` (default).
For `{global: 'window.templates', concat: 'templates.js'}` the example above would produce this:
```js
window.templates = Object.create(null)
window.templates['index.html'] = '
Hello world!
'
```