npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

bisheng-fix

v0.7.4

Published

Transform Markdown files into a SPA website using React.

Downloads

2

Readme

Bi Sheng

npm package NPM downloads Dependency Status

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

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 konw 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 recommanded way to use bisheng is that 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.

port: Number

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

root: String

If the website will be deploy 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.

Sites built with BiSheng

Liscense

MIT