Allow using Storybook for local development.

Storybook is an easy to use UI to enable testing out features.
This allows storybook to pick up changes from react-vis/src so that it
can be used while developing components.

Author: Chris Thomas

packages/website/.babelrc

@@ -0,0 +1 @@
+{}

packages/website/.storybook/main.js

@@ -0,0 +1,28 @@
+/* eslint-env node */
+const {join} = require('path');
+const isProd = process.env.NODE_ENV === 'production';
+
+// This custom webpack config allows storybook to use the source files from 'react-vis'.
+// Changes can be made and instantly be reflected in storybook to allow quick development
+module.exports = {
+  webpackFinal: config => {
+    if (isProd) { return config;}
+
+    const reactVisPath = join(__dirname, '../../react-vis/src')
+
+    // Add an alias to 'react-vis' so that it looks in its src directory.
+    config.resolve.alias['react-vis'] =reactVisPath
+    config.resolve.modules.push(reactVisPath)
+
+    const jsRule = config.module.rules.find(rule => rule.test.test('test.js'));
+    // Add the react-vis/src folder to the list of files to compile
+    jsRule.include.push(reactVisPath)
+
+    const babelLoader = jsRule.use.find(x => x.loader === 'babel-loader');
+    if (babelLoader) {
+      babelLoader.options.rootMode = 'upward'
+    }
+
+    return config;
+  }
+}

packages/website/webpack.config.js

@@ -16,7 +16,8 @@ module.exports = {
   },
   resolve: {
     alias: {
-      react: resolve(__dirname, './node_modules/react')
+      react: resolve(__dirname, './node_modules/react'),
+      'react-vis': resolve('../react-vis/src')
     }
   }
 };