remark-preset-gfm
v1.0.1
Published
Remark preset for gfm
Downloads
299
Maintainers
moyuycReadme
remark-preset-gfm
Remark preset for gfm (GitHub Favorite Markdown)
Features
- Github break line
- Gemoji
- Svg head link anchor
- Code highlight
Installation
npm install remark-preset-gfm
# or use yarn
yarn add remark-preset-gfmUsage
const remark = require('remark')
const html = require('remark-html')
const gfm = require('remark-preset-gfm')
const markdownHtml = remark()
.use(gfm)
.use(html)
.processAsync('markdown text')
.toString()
const htmlOutput = `
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=no">
<link rel="stylesheet" href="//unpkg.com/github-markdown-css">
<link rel="stylesheet" href="//unpkg.com/highlight.js/styles/github.css">
<style>
.markdown-body {
max-width: 65%;
margin: 40px auto 30px;
}
@media screen and (max-width: 1200px) {
.markdown-body {
max-width: 78%;
}
}
@media screen and (max-width: 700px) {
.markdown-body {
max-width: 90%;
margin: 20px auto 10px;
}
}
@media screen and (max-width: 400px) {
.markdown-body {
max-width: 98%;
margin: 20px auto 10px;
}
}
</style>
</head>
<body>
<div class="markdown-body">
${markdownHtml}
</div>
</body>
</html>
`Related
- github-markdown-css - The minimal amount of CSS to replicate the GitHub Markdown style
- Highlight.js github style
Contributing
- Fork it!
- Create your new branch:
git checkout -b feature-neworgit checkout -b fix-which-bug - Start your magic work now
- Make sure npm test passes
- Commit your changes:
git commit -am 'feat: some description (close #123)'orgit commit -am 'fix: some description (fix #123)' - Push to the branch:
git push - Submit a pull request :)
Authors
This library is written and maintained by imcuttle, [email protected].
License
MIT - imcuttle 🐟