Bi Sheng

Bi Sheng was the Chinese inventor of the first known movable type technology.

bisheng is designed to transform Markdown into static websites and blogs using React.

Demo

Features

• Support browserHistory, even in GitHub Pages.
• Lazy load for Markdown data.

Usage

Use bisheng in a new project

git clone [email protected]:benjycui/bisheng-theme-one.git myblog && cd myblog
rm -rf .git && npm i && npm start
open http://127.0.0.1:8000/

Use bisheng in current project

Installation:

npm install --save-dev bisheng

Then, add start to npm scripts:

{
  "scripts": {
    "start": "bisheng start"
  }
}

Create bisheng.config.js, otherwise bisheng will use the default config:

module.exports = {
  source: './posts',
  output: './_site',
  lazyLoad: false,
  theme: './_theme',
  port: 8000,
};

Note: please make sure that source and theme exists, and theme should not be an empty directory. Just copy bisheng-theme-one to theme, if you don't know how to develop a theme.

Now, just run npm start.

Documentation

CLI

We can install bisheng as a cli command and explore what it can do by bisheng -h. However, the recommended way to use bisheng is to install it as devDependencies.

$ npm install -g bisheng
$ bisheng -h
  Usage: bisheng [command] [options]

  Commands:

    start [options]     to start a server
    build [options]     to build and write static files to `config.output`
    gh-pages [options]  to deploy website to gh-pages
    help [cmd]          display help for [cmd]

  Options:

    -h, --help     output usage information
    -V, --version  output the version number

Configuration

bisheng will read bisheng.config.js as its config file, but we can set the config file name by --config, something like this bisheng --config another.config.js.

The content of bisheng.config.js looks like this:

module.exports = {
  source: './posts',
  output: './_site',
  theme: './_theme',
  port: 8000,
  root: '/',
  plugins: [],
};

source: String|Array[String]

To set directory/directories where we place Markdown files.

output: String

To set directory where bisheng will generate (HTML & CSS & JavaScript) files to.

lazyLoad: Boolean

Whether to load Markdown data lazily.

Note: when lazyLoad is true, each page data will be a function which will return a promise.

theme: String

To set directory where we put the theme of website.

More about theme.

• bisheng-theme-one

port: Number

To set the port which will be used when we start a local server.

root: String

If the website will be deployed under a sub-directory of a domain (something like http://benjycui.github.io/bisheng-theme-one/), we must set it (such as /bisheng-theme-one/).

plugins: Array[String]

A list of plugins.

module.exports = {
  plugins: [
    'pluginName?config1=value1&config2=value2',
    'anotherPluginName',
  ],
};

More about plugin.

• bisheng-plugin-description
• bisheng-plugin-toc
• bisheng-plugin-react

Sites built with BiSheng

• Ant Design
• Ant Motion
• Ant Design Mobile

License

MIT