• Stars
    star
    155
  • Rank 240,864 (Top 5 %)
  • Language
    JavaScript
  • License
    MIT License
  • Created almost 6 years ago
  • Updated almost 3 years ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

React Document Build Tool Scripts , Like react-scripts of create react app

Features 🦑

  • 🛠 No config
  • 😆 Based on Markdown,Merge and Show all markdown files
  • 👩‍💻 Code Highlighting And JSX Code is Runnable
  • 💯 Emoji Support
  • 🍖 React Props Table Support
  • Creates Static files (only JS is prism)
  • 🏳️‍🌈 Pretty Pages
  • 🦄 Customizable
  • 🇳🇱 CodeSandbox and iframe Support

Install 🦅

npm install --save doc-scripts

Usage 🌈

1. Node cli

doc-scripts start --input docs

doc-script build --input docs --output doc-site

2. Markdown Usage

examples

3. Javascript api

import {execute} from 'doc-scripts'

const options = {
  title:'xxxx',
  header:'<link rel="stylesheet" href="//xxxxxx">',
  footer:'<script>xxxxx</script>',
  renderer:'./doc-renderer.js',
  requires:[]
}

const webpackConfig = {
  module:{
    rules:[...]
  }
}

execute('start',options,webpackConfig) or execute('build',options,webpackConfig)

4. Webpack extended configuration

Create a new file named doc-scripts.config.js in the root directory. The following is the specific format specification.

module.exports = {
  module: {
    rules: []
  },
  plugins: []
}

//or

module.exports = function(config) {
  return {
    ...config,
    module: {
      rules: []
    },
    plugins: []
  }
}

5. Demo HTML Template extended configuration

Create a new file named doc-scripts.header.html or doc-scripts.footer.html in the root directory. The following is the specific format specification.

<!-- this is doc-scripts.header.html -->
<link rel="stylesheet" href="//unpkg.com/@alifd/next/dist/next.min.css" />

6. Customize Doc Renderer

Create a new file named doc-scripts.renderer.js in the root directory. The following is the specific format specification.

import DocRenderer from 'react-doc-renderer'

//react-doc-renderer default render engien in doc-scripts, so ,you can continue to reuse this component in doc-scripts.renderer.js, or you can completely override its behavior.

export default ({docs = []})=>(
  <div>
    <DocRenderer docs={docs}/>
  </div>
)

Contributors 💪🏻

Janry
Janry

📖 💻 👀 🤔

LICENSE

Doc scripts is open source software licensed as MIT.

More Repositories

1

redux-callbag

🕺🕺Redux middleware for action side effects with callbag 👉< 1KB
JavaScript
182
star
2

react-study

React源码分析,需要进一步了解请移步https://github.com/purplebamboo/little-reactjs
JavaScript
173
star
3

react-eva

Effects+View+Actions(React distributed state management solution with rxjs.)
JavaScript
156
star
4

depath

Path Matcher/Getter/Setter for Object/Array
TypeScript
132
star
5

mfetch

mfetch will provide you with a strong ability to request resource management
JavaScript
93
star
6

awesome-callbags

Callbag Libraries & Learning Material https://github.com/callbag/callbag
86
star
7

callbag-map-promise

Callbag map promise
JavaScript
65
star
8

callbag-delay

callbag delay
JavaScript
60
star
9

immutability-skinable-component

immutability-skinable-component
JavaScript
48
star
10

exp-parser

An expression parser like the angular's parser
JavaScript
41
star
11

kvm

KVM.js 轻量级模块管理器,依赖注入,AMD,Commonjs规范,Promise化
JavaScript
41
star
12

react-propers

Select react doms , and update props.
JavaScript
40
star
13

gub

CLI tool for create an npm package from any repos. 🐳
JavaScript
33
star
14

dot-match

Extremely easy dot path matching tool
JavaScript
29
star
15

qverse

Traverse any data with DPML commands.
JavaScript
25
star
16

immutability

Improve the react components immutability by es6 decorate
JavaScript
14
star
17

react-chrome-boilerplate

Improve your development efficiency to create chrome extension.
JavaScript
9
star
18

github-tag-release

github release by git tags
TypeScript
9
star
19

react-banners

React通用横幅组件
JavaScript
8
star
20

react-snap-svg

react snap.svg
JavaScript
5
star
21

react-stikky

It's very easy to sticky fixed target element.
JavaScript
5
star
22

react-slot-props

slot slot slot , react slot!
JavaScript
5
star
23

react-code-snippet

React Code Snippet
JavaScript
4
star
24

react-site-renderer

JavaScript
3
star
25

awesome-react-suspense

Awesome list of React components with suspense and resources.
3
star
26

react-demo-loader

webpack loader for react demo
JavaScript
2
star
27

dom-imagify

Generates an image from a DOM node using HTML5 canvas
JavaScript
2
star
28

use-element-rect-observer

TypeScript
2
star
29

get-target-cookie

TypeScript
1
star
30

react-doc-renderer

JavaScript
1
star
31

super-plugin

JavaScript
1
star
32

janry.blog.io

1
star
33

clean-ns

Clean Node Modules
JavaScript
1
star
34

janryWang

Config files for my GitHub profile.
1
star
35

deproxy

Downgradable ES Proxy solution
1
star