https://github.com/posthtml/posthtml-modules
Modules Plugin
https://github.com/posthtml/posthtml-modules
Last synced: 10 months ago
JSON representation
Modules Plugin
- Host: GitHub
- URL: https://github.com/posthtml/posthtml-modules
- Owner: posthtml
- License: mit
- Created: 2016-05-20T12:34:58.000Z (over 9 years ago)
- Default Branch: master
- Last Pushed: 2023-03-15T11:43:58.000Z (almost 3 years ago)
- Last Synced: 2024-10-29T21:06:06.618Z (over 1 year ago)
- Language: JavaScript
- Homepage:
- Size: 1.8 MB
- Stars: 84
- Watchers: 9
- Forks: 11
- Open Issues: 11
-
Metadata Files:
- Readme: readme.md
- Changelog: changelog.md
- Funding: .github/funding.yml
- License: license
Awesome Lists containing this project
README
[![NPM][npm]][npm-url]
[![Deps][deps]][deps-url]
[![Tests][travis]][travis-url]
[![Coverage][cover]][cover-url]
[![XO Code Style][style]][style-url]
Modules Plugin
Import and process HTML Modules with PostHTML
## Install
```bash
npm i -D posthtml-modules
```
## Example
```html
title
```
```html
Test
```
```js
const { readFileSync } = require('fs')
const posthtml = require('posthtml')
const options = { /* see available options below */ }
posthtml()
.use(require('posthtml-modules')(options))
.process(readFileSync('index.html', 'utf8'))
.then((result) => result)
});
```
```html
Test title
```
## Options
### `root`
Type: `string`\
Default: `./`
Root path for modules lookup.
### `plugins`
Type: `array | function`\
Default: `[]`
PostHTML plugins to apply for every parsed module.
If a function provided, it will be called with module's file path.
### `from`
Type: `string`\
Default: `''`
Root filename for processing apply, needed for path resolving (it's better to always provide it).
### `initial`
Type: `boolean`\
Default: `false`
Apply plugins to root file after modules processing.
### `tag`
Type: `string`\
Default: `module`
Use a custom tag name.
### `attribute`
Type: `string`\
Default: `href`
Use a custom attribute name.
### `locals`
Type: `object`\
Default: `{}`
Pass data to the module.
If present, the JSON object from the `locals=""` attribute will be merged on top of this, overwriting any existing values.
### `attributeAsLocals`
Type: `boolean`\
Default: `false`
All attributes on `` will be added to [locals](#locals)
### `parser`
Type: `object`\
Default: `{}`
Options for the PostHTML parser.
By default, [`posthtml-parser`](https://github.com/posthtml/posthtml-parser) is used.
### `expressions`
Type: `object`\
Default: `{}`
Options to forward to [posthtml-expressions](https://github.com/posthtml/posthtml-expressions), like custom delimiters for example. Available options can be found [here](https://github.com/posthtml/posthtml-expressions#options).
## Component options
### `locals`
You can pass data to a module using a `locals=""` attribute.
Must be a valid JSON object.
Example:
```handlebars
The foo is {{ foo }} in this one.
```
```handlebars
Or so they say...
```
### Result
```html
The foo is strong in this one.
Or so they say...
```
### `attributeAsLocals`
All attributes on `` will be added to [locals](#locals)
Example:
```handlebars
```
```handlebars
Module content
```
### Result
```html
Module content
```
[npm]: https://img.shields.io/npm/v/posthtml-modules.svg
[npm-url]: https://npmjs.com/package/posthtml-modules
[deps]: https://david-dm.org/posthtml/posthtml-modules.svg
[deps-url]: https://david-dm.org/posthtml/posthtml-modules
[style]: https://img.shields.io/badge/code_style-XO-5ed9c7.svg
[style-url]: https://github.com/sindresorhus/xo
[travis]: http://img.shields.io/travis/posthtml/posthtml-modules.svg
[travis-url]: https://travis-ci.org/posthtml/posthtml-modules
[cover]: https://coveralls.io/repos/github/posthtml/posthtml-modules/badge.svg?branch=master
[cover-url]: https://coveralls.io/github/posthtml/posthtml-modules?branch=master