ssg

ssg is a tiny Markdown → HTML static site generator.

JavaScript

ssg

ssg is a tiny Markdown → HTML static site generator.

Install

Install ssg with

npm i -g @tdjsnelling/ssg

yarn global add @tdjsnelling/ssg

Usage

ssg only requires a path to the directory you wish to build.

ssg .

Markdown files will be compiled to HTML and all other static assets will be copied over to the build directory. HTML is run through prettier to ensure built files remain human readable and editable.

Optionally, you can tell ssg to serve the build and watch for changes with the --serve or -s option. By default the server runs on port 3000, this can be changed with the --port or -p option.

ssg . -s -p 5000

ssg will automatically rebuild files as and when it detects changes.

Options

Each markdown file can have an ‘options’ section before the content, to configure the build process. This section is enclosed in double-percent symbols, %%.

The existing options are as follows:

title: the to include in the page head</li> <li>style: relative path to a CSS or SASS/SCSS file to include on the page. SASS/SCSS is automatically transpiled</li> <li>math: if <code>yes</code>, include KaTeX rendering support on the page</li> <li>code: if <code>yes</code>, include syntax highlighting support on the page</li> <li>highlight: the syntax highlighting theme to use. should be the name of a <a href="https://github.com/highlightjs/highlight.js/tree/master/src/styles">highlight.js theme</a>, otherwise <code>default</code> is used</li> </ul> <h2>Example</h2> <p>This README is built in the <a href="./example">example</a> folder. See the built page <a href="https://tdjsnelling.github.io/ssg/example/build/index.html">here</a>.</p> </div></div></div></div></div></div></div></div><script>window.__NUXT__=(function(a){return {layout:"default",data:[{repo:{name:"ssg",url:"https:\u002F\u002Fgithub.com\u002Ftdjsnelling\u002Fssg",description:"ssg is a tiny Markdown → HTML static site generator.",stars:4,language:"JavaScript",forks:0,list:[330],user_repo:{url:"https:\u002F\u002Fgithub.com\u002Ftdjsnelling",username:"tdjsnelling",type:"User"},slug:"ssg-tdjsnelling",readme_url:"https:\u002F\u002Fraw.githubusercontent.com\u002Ftdjsnelling\u002Fssg\u002Fmaster\u002FREADME.md"},data:"# ssg\n\n_ssg_ is a tiny Markdown → HTML static site generator.\n\n## Install\n\nInstall _ssg_ with\n\n```\nnpm i -g @tdjsnelling\u002Fssg\n```\n\nor\n\n```\nyarn global add @tdjsnelling\u002Fssg\n```\n\n## Usage\n\n_ssg_ only requires a path to the directory you wish to build.\n\n```\nssg .\n```\n\nMarkdown files will be compiled to HTML and all other static assets will be copied over to the build directory. HTML is run through [prettier](https:\u002F\u002Fprettier.io\u002F) to ensure built files remain human readable and editable.\n\nOptionally, you can tell _ssg_ to serve the build and watch for changes with the `--serve` or `-s` option. By default the server runs on port 3000, this can be changed with the `--port` or `-p` option.\n\n```\nssg . -s -p 5000\n```\n\n_ssg_ will automatically rebuild files as and when it detects changes.\n\n## Options\n\nEach markdown file can have an 'options' section before the content, to configure the build process. This section is enclosed in double-percent symbols, `%%`.\n\nThe existing options are as follows:\n\n- title: the \u003Ctitle\u003E to include in the page head\n- style: relative path to a CSS or SASS\u002FSCSS file to include on the page. SASS\u002FSCSS is automatically transpiled\n- math: if `yes`, include KaTeX rendering support on the page\n- code: if `yes`, include syntax highlighting support on the page\n- highlight: the syntax highlighting theme to use. should be the name of a [highlight.js theme](https:\u002F\u002Fgithub.com\u002Fhighlightjs\u002Fhighlight.js\u002Ftree\u002Fmaster\u002Fsrc\u002Fstyles), otherwise `default` is used\n\n## Example\n\nThis README is built in the [example](.\u002Fexample) folder. See the built page [here](https:\u002F\u002Ftdjsnelling.github.io\u002Fssg\u002Fexample\u002Fbuild\u002Findex.html).\n"}],fetch:{},error:a,state:{store:{}},serverRendered:true,routePath:"\u002Fssg-tdjsnelling",config:{_app:{basePath:"\u002F",assetsPath:"\u002F_nuxt\u002F",cdnURL:a}}}}(null));</script><script src="/_nuxt/cb9ae3a.js" defer></script><script src="/_nuxt/f0c76e2.js" defer></script><script src="/_nuxt/13448bd.js" defer></script><script src="/_nuxt/9d4e996.js" defer></script><script src="/_nuxt/35e495c.js" defer></script><script src="/_nuxt/fe257ca.js" defer></script> </body> </html>