React Markdown

React Markdown Loader with code sources as props

This is a fork of react-markdown-loader and add some features

This loader parses markdown files and converts them to a React Stateless Component. It will also parse FrontMatter to import dependencies and render components ~~along with it’s source code~~ and export code sources

I forkedd this loader in order to make the process of creating styleguides for React components easier with my own project

Install

npm install react-markdown-code-loader  --save-dev

Usage

In the FrontMatter you should import the components you want to render with the component name as a key and it's path as the value

webpack.config.js

module: {
  loaders: [
    {
      test: /\.md$/,
      loader: 'babel!react-markdown-code'
    }
  ]
}

Hello.js

import React, { PropTypes } from 'react';

/**
 * HelloWorld
 * @param {Object} props React props
 * @returns {JSX} template
 */
export default function Hello(props) {
  return (
    <div className="hello">
      Hello { props.who }
    </div>
  );
}

Hello.md

app.jsx

import React from 'react'
import ReactDOM from 'react-dom'
import Hello from './Hello.md'

ReactDOM.render(<Hello />,document.body)

Advance Usage