https://github.com/exah/typograf-loader
Typograf loader module for Webpack
https://github.com/exah/typograf-loader
js preprocessor text typograf typography webpack
Last synced: 5 months ago
JSON representation
Typograf loader module for Webpack
- Host: GitHub
- URL: https://github.com/exah/typograf-loader
- Owner: exah
- Created: 2016-03-28T08:34:30.000Z (over 10 years ago)
- Default Branch: master
- Last Pushed: 2016-03-30T10:38:16.000Z (over 10 years ago)
- Last Synced: 2025-10-12T01:26:49.263Z (9 months ago)
- Topics: js, preprocessor, text, typograf, typography, webpack
- Language: HTML
- Homepage:
- Size: 11.7 KB
- Stars: 3
- Watchers: 1
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# typograf-loader
Typograf loader module for webpack. Uses https://github.com/typograf/typograf
Issues with the output should be reported on the typograf [issue tracker](https://github.com/typograf/typograf/issues).
## Install
```
$ npm install --save-dev typograf-loader
```
## Usage
[Documentation: Using loaders](http://webpack.github.io/docs/using-loaders.html)
In your webpack.config.js, add the typograf-loader, chained with the other loaders.
This outputs processed html file with file-loader:
```javascript
loaders: [
{
test: /ru\.html$/,
loaders: [
'file?name=[name].[ext]',
'typograf?lang=ru&mode=name'
]
}
]
```
Or to process markdown texts:
```javascript
loaders: [
{
test: /ru\.md$/,
loaders: [
'html',
'typograf?lang=ru&mode=name',
'markdown'
]
}
]
```
## Options
Full documentation can be found here: https://github.com/typograf/typograf
[List of rules](https://github.com/typograf/typograf/tree/dev/docs)
### lang
Set text language.
Type: `string`
Default: `en`
Options: `en` | `ru`
### mode
Set output style.
Type: `string`
Default: `default`
Options: `default` | `name` | `digit`
- `default`: utf-8 symbols
- `name`: html special characters with name: `&hellip`
- `digit`: html special characters in numbers form: `…`
### enable
Enables rule.
Type: `string` | `[ string, ... ]`
Default: `[]`
Options: `*` | [Rules](https://github.com/typograf/typograf/tree/dev/docs)
### disable
Disables rule.
Type: `string` | `[ string, ... ]`
Default: `[]`
Options: `*` | [Rules](https://github.com/typograf/typograf/tree/dev/docs)
### Examples
Passing options as query string:
```javascript
...
loaders: [
{
test: /ru\.html$/,
loaders: [
'typograf?lang=ru&mode=name&enable[]=ru/optalign/*&disable[]=ru/money/ruble',
]
}
]
...
```
Passing options from object as JSON string:
```javascript
...
loaders: [
{
test: /ru\.html$/,
loaders: [
'typograf?' + JSON.stringify({
lang: 'ru',
mode: 'name',
enable: [ 'ru/optalign/*' ],
disable: [ 'ru/money/ruble' ]
}),
]
}
]
...
```