Ecosyste.ms: Awesome

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

Awesome Lists | Featured Topics | Projects

https://github.com/mottox2/remark-code-titles


https://github.com/mottox2/remark-code-titles

remark-plugin

Last synced: 2 months ago
JSON representation

Awesome Lists containing this project

README

        

# remark-code-titles

[![npm version](https://badge.fury.io/js/remark-code-titles.svg)](https://badge.fury.io/js/remark-code-titles)

[Remark](https://github.com/remarkjs/remark) plugin to add code title inspired by [gatsby-remark-code-titles](https://github.com/DSchau/gatsby-remark-code-titles)

## Usage

We have the following file, `hello.md`:

~~~markdown
# Hello World

```js:hello.js
console.log('js')
```
~~~

And our script, `hello.js`, lokks as follows:

```js:sample.js
const vfile = require('to-vfile')
const unified = require('unified')
const parse = require('remark-parse')
const codeTitle = require('remark-code-titles')
const html = require('remark-html')

const result = unified()
.use(parse)
.use(codeTitle)
.use(html)
.process(vfile.readSync('./hello.md'), (err, file) => {
if (err) throw err
console.log(String(file))
})
```

Now, running `node hello.js` yields:

```html

Hello World


hello.js

console.log('js')


```