restructure demo and dependencies

mkg0 · mkg0 · commit a3f7311d0ad6 · 2018-01-08T14:49:15.000+03:00
diff --git a/.babelrc b/.babelrc
@@ -0,0 +1,12 @@
+{
+  "presets": [
+    "env",
+    "react"
+  ],
+  "plugins": [
+    [
+      "transform-object-rest-spread",
+      "add-module-exports"
+    ]
+  ]
+}
diff --git a/.npmignore b/.npmignore
@@ -5,3 +5,7 @@ node_modules/
 .git/
 src/
 demo/
+webpack.config.js
+yarn.lock.js
+.postcssconfig
+.babelrc
diff --git a/README.md b/README.md
@@ -1,14 +1,23 @@
 # react-date-range
-![](https://badge.fury.io/js/react-date-range.svg)
-![](https://david-dm.org/Adphorus/react-date-range.svg)
-![](https://david-dm.org/Adphorus/react-date-range/dev-status.svg)
+[![npm](https://img.shields.io/npm/v/react-date-range.svg?style=flat-square)](https://www.npmjs.com/package/react-date-range)
+![](https://img.shields.io/bithound/dependencies/github/adphorus/react-date-range.svg?style=flat-square)
+
+[![npm](https://img.shields.io/npm/l/react-date-range.svg?style=flat-square)]()
+[![npm](https://img.shields.io/npm/dm/localeval.svg?style=flat-square)](https://www.npmjs.com/package/react-date-range)
+
 
 A React component for choosing dates and date ranges. Uses [Moment.js](http://momentjs.com/) for date operations.
 
 **Live Demo :** [http://adphorus.github.io/react-date-range](http://adphorus.github.io/react-date-range)
 
 ![](https://cdn.pbrd.co/images/1fjQlZzy.png)
 
+## React Range Picker v2 is coming!
+
+** Want to help us testing the next version? Let's go
+[next branch](https://github.com/adphorus/react-date-range/tree/next)!**
+This version will be depricated soon. 
+
 ## Getting Started
 ### Installation
 
diff --git a/demo/.babelrc b/demo/.babelrc
@@ -0,0 +1,14 @@
+{
+  "presets": [
+    ["env", { "modules": false }],
+    "react"
+  ],
+  "plugins": [
+    ["transform-object-rest-spread"]
+  ],
+  "env": {
+    "development": {
+      "plugins": ["react-hot-loader/babel"]
+    }
+  }
+}
diff --git a/demo/build.js b/demo/build.js
diff --git a/demo/index.html b/demo/index.html
@@ -0,0 +1,13 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1.0">
+  <meta http-equiv="X-UA-Compatible" content="ie=edge">
+  <title>React Date Range Demo</title>
+</head>
+<body>
+  <div id="root"></div>
+  <script src="/main.js"></script>
+</body>
+</html>
diff --git a/demo/package.json b/demo/package.json
diff --git a/demo/src/index.html b/demo/src/index.html
diff --git a/demo/src/main.dev.js b/demo/src/main.dev.js
@@ -0,0 +1,22 @@
+import React from 'react';
+import ReactDOM from 'react-dom';
+import { AppContainer } from 'react-hot-loader';
+import Main from './components/Main';
+
+const render = Component => {
+  ReactDOM.render(
+    <AppContainer>
+      <Main />
+    </AppContainer>,
+    document.getElementById('root'),
+  )
+}
+
+render(Main)
+
+// Webpack Hot Module Replacement API
+if (module.hot) {
+  module.hot.accept('./components/Main', () => {
+    render(Main)
+  })
+}
diff --git a/package.json b/package.json
@@ -4,9 +4,9 @@
   "description": "A React component for choosing dates and date ranges.",
   "main": "lib/index.js",
   "scripts": {
-    "start-dev": "babel ./src --watch --out-dir ./lib & cd demo && npm install && npm run start-dev",
+    "dev": "NODE_ENV=development & webpack-dev-server --hot --inline",
     "prebuild": "rm -rf lib/*",
-    "build": "babel ./src --out-dir ./lib",
+    "build": "NODE_ENV=production & babel ./src --out-dir ./lib",
     "prepublish": "npm run build"
   },
   "keywords": [
@@ -31,9 +31,27 @@
     "prop-types": "^15.5.10"
   },
   "peerDependencies": {
-    "react": "^0.14 || ^15.0.0-rc || ^15.0"
+    "react": "^0.14 || ^15.0.0-rc || >=15.0"
   },
   "devDependencies": {
-    "babel": "^5.8.23"
+    "autoprefixer": "^7.2.4",
+    "babel-cli": "^6.26.0",
+    "babel-loader": "^7.1.2",
+    "babel-plugin-transform-object-rest-spread": "^6.26.0",
+    "babel-preset-env": "^1.6.1",
+    "babel-preset-react": "^6.24.1",
+    "css-loader": "^0.28.8",
+    "node-sass": "^4.7.2",
+    "normalize.css": "^7.0.0",
+    "postcss-loader": "^2.0.10",
+    "postcss-modules": "^1.1.0",
+    "precss": "^2.0.0",
+    "react": "^16.2.0",
+    "react-dom": "^16.2.0",
+    "react-hot-loader": "^3.1.3",
+    "style-loader": "^0.19.1",
+    "webpack": "^3.10.0",
+    "webpack-dev-server": "^2.9.7",
+    "webpack-hot-middleware": "^2.21.0"
   }
 }
diff --git a/postcss.config.js b/postcss.config.js
@@ -0,0 +1,11 @@
+const precss = require('precss');
+const autoprefixer = require('autoprefixer');
+
+
+module.exports = {
+  "modules": true,
+  plugins: [
+    precss,
+    autoprefixer
+  ]
+}
diff --git a/webpack.config.js b/webpack.config.js
@@ -0,0 +1,57 @@
+const webpack = require('webpack');
+const path = require('path');
+
+const IS_DEV = (process.env.NODE_ENV || 'development') === 'development';
+console.log(process.env.NODE_ENV)
+function hotInject(path) {
+  return IS_DEV
+    ? [
+        "react-hot-loader/patch",
+        //`webpack-hot-middleware/client?http://localhost:8080/`,
+        path.replace(/\.js$/, '.dev.js'),
+      ]
+    : [path];
+}
+
+module.exports = {
+  entry: {
+    main: hotInject(path.resolve("./demo/src/main.js"))
+  },
+  output: {
+    path: path.resolve("./demo/dist"),
+    filename: "[name].js",
+  },
+  module: {
+    rules: [
+      {
+        test: /\.js$/,
+        loader: "babel-loader?filenameRelative=" + path.resolve("./"),
+        exclude: /(node_modules)|(demo)/,
+      },
+      {
+        test: /\.js$/,
+        loader: `babel-loader?extends=${path.resolve('./demo/.babelrc')}&sourceRoot=${path.resolve('./')}`,
+        include: path.resolve('./demo'),
+      },
+      {
+        test: /\.s?css$/,
+        use: [
+          "style-loader",
+          "css-loader?module&importLoaders=1",
+          "postcss-loader"
+        ],
+      },
+    ]
+  },
+  plugins: [
+    // new HtmlWebpackPlugin({
+    //   template: getPath("demo/index.html")
+    // }),
+  ],
+  devtool: IS_DEV ? "#eval-source-map" : "source-map",
+  devServer: {
+    hot: true,
+    contentBase: "./demo",
+    publicPath: "/"
+  }
+};
diff --git a/yarn.lock b/yarn.lock
