Skip to content

Commit df83356

Browse files
author
Jonathon Kelly
committed
add pages
1 parent c2d0fff commit df83356

File tree

8 files changed

+241
-11
lines changed

8 files changed

+241
-11
lines changed

‎.gitignore‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -8,8 +8,8 @@ gen
88
# https://www.npmjs.org/doc/misc/npm-faq.html#should-i-check-my-node_modules-folder-into-git
99
node_modules
1010

11-
# lib
12-
lib
11+
# dist
12+
dist
1313

1414
# log
1515
*.log

‎package.json‎

Lines changed: 24 additions & 9 deletions
Original file line numberDiff line numberDiff line change
@@ -2,19 +2,20 @@
22
"name": "react-markdown-renderer",
33
"version": "0.1.2",
44
"description": "Simple React component that renders Markdown",
5-
"main": "lib/index.js",
5+
"main": "dist/index.js",
66
"files": [
7-
"lib"
7+
"dist"
88
],
9-
"config": {
10-
"entry": "src",
11-
"output": "lib"
12-
},
139
"scripts": {
14-
"build": "babel $npm_package_config_entry --out-dir $npm_package_config_output",
10+
"start": "webpack-dev-server --content-base pages",
11+
"clean-build": "rimraf dist",
12+
"build": "npm run clean-build && babel src --out-dir dist",
13+
"build-pages": "npm run clean-build && NODE_ENV=production webpack --config ./webpack.production.config.js --progress --profile --colors",
1514
"lint": "eslint --ignore-path .gitignore .",
1615
"test": "npm run lint",
17-
"prepublish": "npm run build && npm test"
16+
"prepublish": "npm run build && npm test",
17+
"prepublish-pages": "npm run build-pages",
18+
"publish-pages": "node ./tasks/publishPages"
1819
},
1920
"repository": {
2021
"type": "git",
@@ -35,10 +36,24 @@
3536
"devDependencies": {
3637
"babel-cli": "^6.6.5",
3738
"babel-core": "^6.7.2",
39+
"babel-loader": "^6.2.4",
3840
"babel-preset-es2015": "^6.6.0",
3941
"babel-preset-react": "^6.5.0",
42+
"copy-webpack-plugin": "^1.1.1",
43+
"css-loader": "^0.23.1",
4044
"eslint": "^2.4.0",
4145
"eslint-config-airbnb": "^6.1.0",
42-
"eslint-plugin-react": "^4.2.1"
46+
"eslint-plugin-react": "^4.2.1",
47+
"gh-pages": "^0.11.0",
48+
"html-webpack-plugin": "^2.10.0",
49+
"react": "^0.14.7",
50+
"react-dom": "^0.14.7",
51+
"react-textarea-autosize": "^3.3.0",
52+
"rimraf": "^2.5.2",
53+
"stats-webpack-plugin": "^0.3.1",
54+
"style-loader": "^0.13.0",
55+
"stylus-loader": "^1.5.1",
56+
"webpack": "^1.12.14",
57+
"webpack-dev-server": "^1.14.1"
4358
}
4459
}

‎pages/index.html‎

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
<!DOCTYPE html>
2+
<html lang="en">
3+
<head>
4+
<meta charset='utf-8'>
5+
<meta http-equiv="X-UA-Compatible" content="chrome=1">
6+
<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
7+
8+
<title>React-markdown-renderer by InsidersByte</title>
9+
</head>
10+
<body>
11+
<div class="container">
12+
<h1>React Markdown Renderer</h1>
13+
14+
<h2><a href="http://github.com/InsidersByte/react-markdown-renderer">View project on GitHub</a></h2>
15+
16+
<!-- the example app is rendered into this div -->
17+
<div id="app"></div>
18+
19+
<footer>
20+
Copyright &copy; 2016 Jonathon kelly.
21+
</footer>
22+
</div>
23+
24+
<script src="bundle.js"></script>
25+
</body>
26+
</html>

‎pages/main.jsx‎

Lines changed: 43 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,43 @@
1+
import React from 'react';
2+
import ReactDOM from 'react-dom';
3+
import Textarea from 'react-textarea-autosize';
4+
5+
import MarkdownRenderer from '../src';
6+
7+
import './main.styl';
8+
9+
class App extends React.Component {
10+
constructor() {
11+
super();
12+
13+
this.state = {
14+
markdown: '# This is an H1 \n## This is an H2 \n###### This is an H6',
15+
};
16+
17+
this.updateMarkdown = this.updateMarkdown.bind(this);
18+
}
19+
20+
updateMarkdown(event) {
21+
this.setState({ markdown: event.target.value });
22+
}
23+
24+
render() {
25+
return (
26+
<div className="markdown-editor">
27+
<div>
28+
<h2>Markdown Editor</h2>
29+
30+
<Textarea value={this.state.markdown} onChange={this.onChange} />
31+
</div>
32+
33+
<div>
34+
<h2>React Markdown Renderer</h2>
35+
36+
<MarkdownRenderer className="markdown-editor__preview" markdown={this.state.markdown} />
37+
</div>
38+
</div>
39+
);
40+
}
41+
}
42+
43+
ReactDOM.render(<App />, document.getElementById('app'));

‎pages/main.styl‎

Lines changed: 60 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,60 @@
1+
body
2+
font-family Helvetica Neue, Helvetica, Arial, sans-serif
3+
font-size 14px
4+
margin 0
5+
padding 0
6+
font-weight lighter
7+
8+
h1
9+
h2
10+
h3
11+
h4
12+
h5
13+
h6
14+
font-weight lighter
15+
margin: 0.5em 0;
16+
17+
a
18+
color #08c
19+
text-decoration none
20+
21+
&:hover
22+
text-decoration: underline
23+
24+
.container
25+
max-width 1080px
26+
margin auto
27+
padding 1em
28+
29+
#app
30+
border-top 1px solid #eee
31+
32+
.markdown-editor
33+
display flex
34+
justify-content space-around
35+
align-items stretch
36+
min-height 500px
37+
38+
> *
39+
flex 1 1 50%
40+
max-width 50%
41+
max-height 100%
42+
display flex
43+
flex-direction column
44+
padding-right 2%
45+
46+
> *:last-child
47+
flex 1
48+
49+
.markdown-editor__preview
50+
img
51+
max-width 100%
52+
53+
:last-child
54+
margin-bottom: 0
55+
56+
footer
57+
border-top 1px solid #eee
58+
text-align center
59+
margin-top 20px
60+
padding 20px 0

‎tasks/publishPages.js‎

Lines changed: 10 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,10 @@
1+
const ghpages = require('gh-pages');
2+
const path = require('path');
3+
4+
ghpages
5+
.publish(
6+
path.join(__dirname, '../dist'),
7+
(error) => {
8+
console.error(error);
9+
}
10+
);

‎webpack.config.js‎

Lines changed: 29 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,29 @@
1+
const path = require('path');
2+
3+
module.exports = {
4+
devtool: 'eval-source-map',
5+
entry: {
6+
app: ['./pages/main.jsx'],
7+
},
8+
output: {
9+
path: path.resolve(__dirname, 'pages'),
10+
filename: 'bundle.js',
11+
},
12+
module: {
13+
loaders: [
14+
{
15+
test: /\.css$/,
16+
loaders: ['style', 'css'],
17+
},
18+
{
19+
test: /\.styl$/,
20+
loaders: ['style', 'css', 'stylus'],
21+
},
22+
{
23+
test: /\.jsx?$/,
24+
loaders: ['babel'],
25+
exclude: /node_modules/,
26+
},
27+
],
28+
},
29+
};

‎webpack.production.config.js‎

Lines changed: 47 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,47 @@
1+
const path = require('path');
2+
const webpack = require('webpack');
3+
const StatsPlugin = require('stats-webpack-plugin');
4+
const CopyWebpackPlugin = require('copy-webpack-plugin');
5+
6+
module.exports = {
7+
entry: [
8+
path.resolve(__dirname, 'pages/main.jsx'),
9+
],
10+
output: {
11+
path: path.join(__dirname, '/dist/'),
12+
filename: 'bundle.js',
13+
},
14+
module: {
15+
loaders: [
16+
{
17+
test: /\.css$/,
18+
loaders: ['style', 'css'],
19+
},
20+
{
21+
test: /\.styl$/,
22+
loaders: ['style', 'css', 'stylus'],
23+
},
24+
{
25+
test: /\.jsx?$/,
26+
loader: 'babel',
27+
exclude: /node_modules/,
28+
},
29+
],
30+
},
31+
plugins: [
32+
new CopyWebpackPlugin([
33+
{ from: 'pages/index.html', to: 'index.html' },
34+
]),
35+
new webpack.optimize.OccurenceOrderPlugin(),
36+
new webpack.optimize.UglifyJsPlugin({
37+
compressor: {
38+
warnings: false,
39+
screw_ie8: true,
40+
},
41+
}),
42+
new StatsPlugin('webpack.stats.json', {
43+
source: false,
44+
modules: false,
45+
}),
46+
],
47+
};

0 commit comments

Comments
 (0)