From 1cebfc0b73fb9e5825d1a167c6352aa54e5da674 Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Sat, 20 Jan 2018 18:44:59 +0100
Subject: [PATCH 01/13] ADD __dirname support to default webpack config & add
 it to official example & docs

---
 .../src/pages/basics/writing-stories/index.md | 20 +++++++++++++++++++
 examples/official-storybook/README.md         |  1 +
 .../stories/other-dirname.stories.js          | 10 ++++++++++
 examples/official-storybook/webpack.config.js |  3 +++
 .../server/config/defaults/webpack.config.js  |  5 +++++
 5 files changed, 39 insertions(+)
 create mode 100644 examples/official-storybook/stories/other-dirname.stories.js

diff --git a/docs/src/pages/basics/writing-stories/index.md b/docs/src/pages/basics/writing-stories/index.md
index 0b993ea118bd..1addd8670049 100644
--- a/docs/src/pages/basics/writing-stories/index.md
+++ b/docs/src/pages/basics/writing-stories/index.md
@@ -143,6 +143,26 @@ storiesOf('My App/Buttons/Emoji', module)
   ));
 ```
 
+## Generating nesting path based on __dirname
+
+The name is just a javascript string, by using a template literal, you can easily interpolate data.
+
+One example would be to use `__dirname`:
+```js
+import React from 'react';
+import { storiesOf } from '@storybook/react';
+
+import BaseButton from './BaseButton';
+
+const base = __dirname;
+
+storiesOf(`Category|${base}/BaseButton`, module)
+  .add('story 1', () => <BaseButton label="Story 1" />)
+  .add('story 2', () => <BaseButton label="Story 2" />);
+```
+
+*The usage of `__dirname` is dependent on webpack transforming it correctly. Either don't change the default config, add the nessesary config yourself, or import the storybook default, see [custom webpack config](/configurations/custom-webpack-config/#full-control-mode--default)*
+
 ## Run multiple storybooks
 
 You can run multiple storybooks for different kinds of stories (or components). To do that, you can create different NPM scripts to start different stories. See:
diff --git a/examples/official-storybook/README.md b/examples/official-storybook/README.md
index 648028a525b4..cee8e08fef36 100644
--- a/examples/official-storybook/README.md
+++ b/examples/official-storybook/README.md
@@ -5,3 +5,4 @@ This storybook includes stories for:
  - `@storybook/components` - reusable UI components for addon authors
  - `@storybook/ui` - the UI of storybook itself
  - `@storybook/addon-*` - various addons.
+ - `@storybook/other-*` - various examples.
diff --git a/examples/official-storybook/stories/other-dirname.stories.js b/examples/official-storybook/stories/other-dirname.stories.js
new file mode 100644
index 000000000000..e004f216888b
--- /dev/null
+++ b/examples/official-storybook/stories/other-dirname.stories.js
@@ -0,0 +1,10 @@
+import React from 'react';
+import { storiesOf } from '@storybook/react';
+
+import BaseButton from '../components/BaseButton';
+
+const base = __dirname;
+
+storiesOf(`Other|${base}/Dirname Example`, module)
+  .add('story 1', () => <BaseButton label="Story 1" />)
+  .add('story 2', () => <BaseButton label="Story 2" />);
diff --git a/examples/official-storybook/webpack.config.js b/examples/official-storybook/webpack.config.js
index 0a6124501f5b..a883c3fa8f52 100644
--- a/examples/official-storybook/webpack.config.js
+++ b/examples/official-storybook/webpack.config.js
@@ -1,6 +1,9 @@
 const path = require('path');
 
 module.exports = {
+  node: {
+    __dirname: true,
+  },
   module: {
     rules: [
       {
diff --git a/lib/core/src/server/config/defaults/webpack.config.js b/lib/core/src/server/config/defaults/webpack.config.js
index 8987fef8f2e3..9890ad284936 100644
--- a/lib/core/src/server/config/defaults/webpack.config.js
+++ b/lib/core/src/server/config/defaults/webpack.config.js
@@ -60,6 +60,11 @@ export function createDefaultWebpackConfig(storybookBaseConfig, includePaths) {
     'babel-runtime/regenerator': require.resolve('babel-runtime/regenerator'),
   };
 
+  newConfig.node = {
+    ...storybookBaseConfig.node,
+    __dirname: true,
+  };
+
   // Return the altered config
   return newConfig;
 }

From 9908625644f8f6a35e71ca4916e77a48f492f38d Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Sat, 20 Jan 2018 18:56:55 +0100
Subject: [PATCH 02/13] UPDATE snapshots

---
 .../__snapshots__/other-dirname.stories.storyshot   | 13 +++++++++++++
 1 file changed, 13 insertions(+)
 create mode 100644 examples/official-storybook/stories/__snapshots__/other-dirname.stories.storyshot

diff --git a/examples/official-storybook/stories/__snapshots__/other-dirname.stories.storyshot b/examples/official-storybook/stories/__snapshots__/other-dirname.stories.storyshot
new file mode 100644
index 000000000000..105b39e7b340
--- /dev/null
+++ b/examples/official-storybook/stories/__snapshots__/other-dirname.stories.storyshot
@@ -0,0 +1,13 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Storyshots Other|/Users/dev/Projects/GitHub/storybook/core/examples/official-storybook/stories/Dirname Example story 1 1`] = `
+<button>
+  Story 1
+</button>
+`;
+
+exports[`Storyshots Other|/Users/dev/Projects/GitHub/storybook/core/examples/official-storybook/stories/Dirname Example story 2 1`] = `
+<button>
+  Story 2
+</button>
+`;

From 44457d3633614ce45e58ae33401698bf6e97911f Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Mon, 22 Jan 2018 17:10:20 +0100
Subject: [PATCH 03/13] WIP

---
 docs/src/pages/basics/writing-stories/index.md                | 2 +-
 .../stories/__snapshots__/other-dirname.stories.storyshot     | 4 ++--
 examples/official-storybook/stories/other-dirname.stories.js  | 2 +-
 examples/official-storybook/webpack.config.js                 | 2 +-
 4 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/docs/src/pages/basics/writing-stories/index.md b/docs/src/pages/basics/writing-stories/index.md
index 1addd8670049..24b902668415 100644
--- a/docs/src/pages/basics/writing-stories/index.md
+++ b/docs/src/pages/basics/writing-stories/index.md
@@ -154,7 +154,7 @@ import { storiesOf } from '@storybook/react';
 
 import BaseButton from './BaseButton';
 
-const base = __dirname;
+const base = __dirname.replace(process.cwd(), '');
 
 storiesOf(`Category|${base}/BaseButton`, module)
   .add('story 1', () => <BaseButton label="Story 1" />)
diff --git a/examples/official-storybook/stories/__snapshots__/other-dirname.stories.storyshot b/examples/official-storybook/stories/__snapshots__/other-dirname.stories.storyshot
index 105b39e7b340..f3c3b28462ef 100644
--- a/examples/official-storybook/stories/__snapshots__/other-dirname.stories.storyshot
+++ b/examples/official-storybook/stories/__snapshots__/other-dirname.stories.storyshot
@@ -1,12 +1,12 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Storyshots Other|/Users/dev/Projects/GitHub/storybook/core/examples/official-storybook/stories/Dirname Example story 1 1`] = `
+exports[`Storyshots Other|/examples/official-storybook/stories/Dirname Example story 1 1`] = `
 <button>
   Story 1
 </button>
 `;
 
-exports[`Storyshots Other|/Users/dev/Projects/GitHub/storybook/core/examples/official-storybook/stories/Dirname Example story 2 1`] = `
+exports[`Storyshots Other|/examples/official-storybook/stories/Dirname Example story 2 1`] = `
 <button>
   Story 2
 </button>
diff --git a/examples/official-storybook/stories/other-dirname.stories.js b/examples/official-storybook/stories/other-dirname.stories.js
index e004f216888b..64eba2630f5c 100644
--- a/examples/official-storybook/stories/other-dirname.stories.js
+++ b/examples/official-storybook/stories/other-dirname.stories.js
@@ -3,7 +3,7 @@ import { storiesOf } from '@storybook/react';
 
 import BaseButton from '../components/BaseButton';
 
-const base = __dirname;
+const base = __dirname.replace(process.cwd(), '');
 
 storiesOf(`Other|${base}/Dirname Example`, module)
   .add('story 1', () => <BaseButton label="Story 1" />)
diff --git a/examples/official-storybook/webpack.config.js b/examples/official-storybook/webpack.config.js
index a883c3fa8f52..ee2f4c33c8d2 100644
--- a/examples/official-storybook/webpack.config.js
+++ b/examples/official-storybook/webpack.config.js
@@ -2,7 +2,7 @@ const path = require('path');
 
 module.exports = {
   node: {
-    __dirname: true,
+    __dirname: false,
   },
   module: {
     rules: [

From f48dfff8f797a66d0aee28a50fcc9ad1d5d30ab2 Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Mon, 22 Jan 2018 19:46:46 +0100
Subject: [PATCH 04/13] REFACTOR to use babel-macro instead of webpack
 __dirname injection

This is more reliable and powerful
---
 .babelrc                                      |  1 +
 app/angular/package.json                      |  2 +
 app/angular/src/server/config/babel.js        | 37 +++++++++++--------
 app/polymer/package.json                      |  2 +
 app/polymer/src/server/config/babel.js        |  1 +
 app/react-native/package.json                 |  2 +
 app/react-native/src/server/config/babel.js   |  1 +
 app/react/package.json                        |  2 +
 app/react/src/server/config/babel.js          |  1 +
 app/vue/package.json                          |  2 +
 app/vue/src/server/config/babel.js            |  1 +
 examples/official-storybook/package.json      |  1 +
 .../other-dirname.stories.storyshot           | 12 ++++++
 .../stories/other-dirname.stories.js          |  4 +-
 examples/official-storybook/webpack.config.js |  3 --
 .../server/config/defaults/webpack.config.js  |  5 ---
 yarn.lock                                     | 33 ++++++++++++-----
 17 files changed, 76 insertions(+), 34 deletions(-)

diff --git a/.babelrc b/.babelrc
index b4f96f58d192..9911a5be17c3 100644
--- a/.babelrc
+++ b/.babelrc
@@ -1,6 +1,7 @@
 {
   "presets": ["env", "stage-0", "react"],
   "plugins": [
+    "babel-plugin-macros",
     ["transform-runtime", {
       "polyfill": false,
       "regenerator": true
diff --git a/app/angular/package.json b/app/angular/package.json
index f9d446e8efdc..bb51a1c5646b 100644
--- a/app/angular/package.json
+++ b/app/angular/package.json
@@ -35,6 +35,8 @@
     "autoprefixer": "^7.2.5",
     "babel-core": "^6.26.0",
     "babel-loader": "^7.0.0",
+    "babel-plugin-macros": "^2.0.0",
+    "babel-plugin-preval": "^1.6.3",
     "babel-plugin-react-docgen": "^1.8.2",
     "babel-preset-env": "^1.6.0",
     "babel-preset-react": "^6.24.1",
diff --git a/app/angular/src/server/config/babel.js b/app/angular/src/server/config/babel.js
index 6715e3f302d8..0ce366ebe9a4 100644
--- a/app/angular/src/server/config/babel.js
+++ b/app/angular/src/server/config/babel.js
@@ -1,24 +1,29 @@
-/**
- * Copyright (c) 2015-present, Facebook, Inc.
- * All rights reserved.
- *
- * This source code is licensed under the BSD-style license found in the
- * LICENSE file in the root directory of this source tree. An additional grant
- * of patent rights can be found in the PATENTS file in the same directory.
- */
-
-const findCacheDir = require('find-cache-dir');
-
 module.exports = {
   // Don't try to find .babelrc because we want to force this configuration.
   babelrc: false,
-  // This is a feature of `babel-loader` for webpack (not Babel itself).
-  // It enables a cache directory for faster-rebuilds
-  // `find-cache-dir` will create the cache directory under the node_modules directory.
-  cacheDirectory: findCacheDir({ name: 'react-storybook' }),
   presets: [
-    require.resolve('babel-preset-env'),
+    [
+      require.resolve('babel-preset-env'),
+      {
+        targets: {
+          browsers: ['last 2 versions', 'safari >= 7'],
+        },
+        modules: process.env.NODE_ENV === 'test' ? 'commonjs' : false,
+      },
+    ],
     require.resolve('babel-preset-stage-0'),
     require.resolve('babel-preset-react'),
   ],
+  plugins: [
+    require.resolve('babel-plugin-macros'),
+    require.resolve('babel-plugin-transform-regenerator'),
+    [
+      require.resolve('babel-plugin-transform-runtime'),
+      {
+        helpers: true,
+        polyfill: true,
+        regenerator: true,
+      },
+    ],
+  ],
 };
diff --git a/app/polymer/package.json b/app/polymer/package.json
index 5a80ce14af9c..4d910730ef3a 100644
--- a/app/polymer/package.json
+++ b/app/polymer/package.json
@@ -33,6 +33,8 @@
     "autoprefixer": "^7.1.6",
     "babel-core": "^6.26.0",
     "babel-loader": "^7.1.2",
+    "babel-plugin-macros": "^2.0.0",
+    "babel-plugin-preval": "^1.6.3",
     "babel-plugin-react-docgen": "^1.8.2",
     "babel-plugin-transform-regenerator": "^6.26.0",
     "babel-plugin-transform-runtime": "^6.23.0",
diff --git a/app/polymer/src/server/config/babel.js b/app/polymer/src/server/config/babel.js
index 2f904b2e2fd2..0ce366ebe9a4 100644
--- a/app/polymer/src/server/config/babel.js
+++ b/app/polymer/src/server/config/babel.js
@@ -15,6 +15,7 @@ module.exports = {
     require.resolve('babel-preset-react'),
   ],
   plugins: [
+    require.resolve('babel-plugin-macros'),
     require.resolve('babel-plugin-transform-regenerator'),
     [
       require.resolve('babel-plugin-transform-runtime'),
diff --git a/app/react-native/package.json b/app/react-native/package.json
index 92b19352fbb3..b03c80789d8d 100644
--- a/app/react-native/package.json
+++ b/app/react-native/package.json
@@ -33,6 +33,8 @@
     "@storybook/ui": "^3.4.0-alpha.5",
     "autoprefixer": "^7.2.5",
     "babel-loader": "^7.1.2",
+    "babel-plugin-macros": "^2.0.0",
+    "babel-plugin-preval": "^1.6.3",
     "babel-plugin-syntax-async-functions": "^6.13.0",
     "babel-plugin-syntax-trailing-function-commas": "^6.22.0",
     "babel-plugin-transform-class-properties": "^6.24.1",
diff --git a/app/react-native/src/server/config/babel.js b/app/react-native/src/server/config/babel.js
index 0a02919c85fb..7c4414c5fa4b 100644
--- a/app/react-native/src/server/config/babel.js
+++ b/app/react-native/src/server/config/babel.js
@@ -11,6 +11,7 @@ module.exports = {
     require.resolve('babel-preset-react'),
   ],
   plugins: [
+    require.resolve('babel-plugin-macros'),
     require.resolve('babel-plugin-syntax-trailing-function-commas'),
     require.resolve('babel-plugin-syntax-async-functions'),
     require.resolve('babel-plugin-transform-class-properties'),
diff --git a/app/react/package.json b/app/react/package.json
index 92e0312454a7..f7300210fa10 100644
--- a/app/react/package.json
+++ b/app/react/package.json
@@ -34,6 +34,8 @@
     "airbnb-js-shims": "^1.4.0",
     "autoprefixer": "^7.2.5",
     "babel-loader": "^7.1.2",
+    "babel-plugin-macros": "^2.0.0",
+    "babel-plugin-preval": "^1.6.3",
     "babel-plugin-react-docgen": "^1.8.2",
     "babel-plugin-transform-regenerator": "^6.26.0",
     "babel-plugin-transform-runtime": "^6.23.0",
diff --git a/app/react/src/server/config/babel.js b/app/react/src/server/config/babel.js
index 2f904b2e2fd2..0ce366ebe9a4 100644
--- a/app/react/src/server/config/babel.js
+++ b/app/react/src/server/config/babel.js
@@ -15,6 +15,7 @@ module.exports = {
     require.resolve('babel-preset-react'),
   ],
   plugins: [
+    require.resolve('babel-plugin-macros'),
     require.resolve('babel-plugin-transform-regenerator'),
     [
       require.resolve('babel-plugin-transform-runtime'),
diff --git a/app/vue/package.json b/app/vue/package.json
index 05adc154862e..cbbb3f601a79 100644
--- a/app/vue/package.json
+++ b/app/vue/package.json
@@ -32,6 +32,8 @@
     "airbnb-js-shims": "^1.4.0",
     "autoprefixer": "^7.2.5",
     "babel-loader": "^7.1.2",
+    "babel-plugin-macros": "^2.0.0",
+    "babel-plugin-preval": "^1.6.3",
     "babel-plugin-react-docgen": "^1.8.2",
     "babel-plugin-transform-regenerator": "^6.26.0",
     "babel-plugin-transform-runtime": "^6.23.0",
diff --git a/app/vue/src/server/config/babel.js b/app/vue/src/server/config/babel.js
index 2f904b2e2fd2..0ce366ebe9a4 100644
--- a/app/vue/src/server/config/babel.js
+++ b/app/vue/src/server/config/babel.js
@@ -15,6 +15,7 @@ module.exports = {
     require.resolve('babel-preset-react'),
   ],
   plugins: [
+    require.resolve('babel-plugin-macros'),
     require.resolve('babel-plugin-transform-regenerator'),
     [
       require.resolve('babel-plugin-transform-runtime'),
diff --git a/examples/official-storybook/package.json b/examples/official-storybook/package.json
index d85f2be5dbf6..3a953507316a 100644
--- a/examples/official-storybook/package.json
+++ b/examples/official-storybook/package.json
@@ -26,6 +26,7 @@
     "@storybook/components": "^3.4.0-alpha.5",
     "@storybook/react": "^3.4.0-alpha.5",
     "babel-jest": "^21.2.0",
+    "babel-plugin-preval": "^1.6.3",
     "enzyme": "^3.3.0",
     "enzyme-adapter-react-16": "^1.1.0",
     "enzyme-to-json": "^3.2.2",
diff --git a/examples/official-storybook/stories/__snapshots__/other-dirname.stories.storyshot b/examples/official-storybook/stories/__snapshots__/other-dirname.stories.storyshot
index f3c3b28462ef..9a21a1288bd4 100644
--- a/examples/official-storybook/stories/__snapshots__/other-dirname.stories.storyshot
+++ b/examples/official-storybook/stories/__snapshots__/other-dirname.stories.storyshot
@@ -11,3 +11,15 @@ exports[`Storyshots Other|/examples/official-storybook/stories/Dirname Example s
   Story 2
 </button>
 `;
+
+exports[`Storyshots Other|examples/official-storybook/stories/Dirname Example story 1 1`] = `
+<button>
+  Story 1
+</button>
+`;
+
+exports[`Storyshots Other|examples/official-storybook/stories/Dirname Example story 2 1`] = `
+<button>
+  Story 2
+</button>
+`;
diff --git a/examples/official-storybook/stories/other-dirname.stories.js b/examples/official-storybook/stories/other-dirname.stories.js
index 64eba2630f5c..8703d7b103c6 100644
--- a/examples/official-storybook/stories/other-dirname.stories.js
+++ b/examples/official-storybook/stories/other-dirname.stories.js
@@ -1,9 +1,11 @@
 import React from 'react';
+import preval from 'babel-plugin-preval/macro';
+
 import { storiesOf } from '@storybook/react';
 
 import BaseButton from '../components/BaseButton';
 
-const base = __dirname.replace(process.cwd(), '');
+const base = preval`module.exports = __dirname.replace(process.cwd() + '/', '')`;
 
 storiesOf(`Other|${base}/Dirname Example`, module)
   .add('story 1', () => <BaseButton label="Story 1" />)
diff --git a/examples/official-storybook/webpack.config.js b/examples/official-storybook/webpack.config.js
index ee2f4c33c8d2..0a6124501f5b 100644
--- a/examples/official-storybook/webpack.config.js
+++ b/examples/official-storybook/webpack.config.js
@@ -1,9 +1,6 @@
 const path = require('path');
 
 module.exports = {
-  node: {
-    __dirname: false,
-  },
   module: {
     rules: [
       {
diff --git a/lib/core/src/server/config/defaults/webpack.config.js b/lib/core/src/server/config/defaults/webpack.config.js
index 9890ad284936..8987fef8f2e3 100644
--- a/lib/core/src/server/config/defaults/webpack.config.js
+++ b/lib/core/src/server/config/defaults/webpack.config.js
@@ -60,11 +60,6 @@ export function createDefaultWebpackConfig(storybookBaseConfig, includePaths) {
     'babel-runtime/regenerator': require.resolve('babel-runtime/regenerator'),
   };
 
-  newConfig.node = {
-    ...storybookBaseConfig.node,
-    __dirname: true,
-  };
-
   // Return the altered config
   return newConfig;
 }
diff --git a/yarn.lock b/yarn.lock
index b3242fe0802b..22ac9e59293d 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1247,6 +1247,12 @@ babel-plugin-jsx-vue-functional@^2.1.0:
   version "2.1.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-jsx-vue-functional/-/babel-plugin-jsx-vue-functional-2.1.0.tgz#5630a0c86fe1904d28c30465e6bf1cf71235a239"
 
+babel-plugin-macros@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/babel-plugin-macros/-/babel-plugin-macros-2.0.0.tgz#fd3aee135f7dec0b82898b7c8f1aed6fa75f9af9"
+  dependencies:
+    cosmiconfig "3.1.0"
+
 babel-plugin-minify-builtins@^0.2.0:
   version "0.2.0"
   resolved "https://registry.yarnpkg.com/babel-plugin-minify-builtins/-/babel-plugin-minify-builtins-0.2.0.tgz#317f824b0907210b6348671bb040ca072e2e0c82"
@@ -1312,6 +1318,15 @@ babel-plugin-minify-type-constructors@^0.2.0:
   dependencies:
     babel-helper-is-void-0 "^0.2.0"
 
+babel-plugin-preval@^1.6.3:
+  version "1.6.3"
+  resolved "https://registry.yarnpkg.com/babel-plugin-preval/-/babel-plugin-preval-1.6.3.tgz#df784357410a9762f01bf0c5705e2c070eac3ccb"
+  dependencies:
+    babel-plugin-macros "^2.0.0"
+    babel-register "^6.26.0"
+    babylon "^6.18.0"
+    require-from-string "^2.0.1"
+
 babel-plugin-react-docgen@^1.8.2:
   version "1.8.2"
   resolved "https://registry.yarnpkg.com/babel-plugin-react-docgen/-/babel-plugin-react-docgen-1.8.2.tgz#4615da43588c8cf5bdcae028f217954c70e6770b"
@@ -3556,6 +3571,15 @@ core-util-is@1.0.2, core-util-is@~1.0.0:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/core-util-is/-/core-util-is-1.0.2.tgz#b5fd54220aa2bc5ab57aab7140c940754503c1a7"
 
+cosmiconfig@3.1.0, cosmiconfig@^3.1.0:
+  version "3.1.0"
+  resolved "https://registry.yarnpkg.com/cosmiconfig/-/cosmiconfig-3.1.0.tgz#640a94bf9847f321800403cd273af60665c73397"
+  dependencies:
+    is-directory "^0.3.1"
+    js-yaml "^3.9.0"
+    parse-json "^3.0.0"
+    require-from-string "^2.0.1"
+
 cosmiconfig@^2.1.0, cosmiconfig@^2.1.1:
   version "2.2.2"
   resolved "https://registry.yarnpkg.com/cosmiconfig/-/cosmiconfig-2.2.2.tgz#6173cebd56fac042c1f4390edf7af6c07c7cb892"
@@ -3568,15 +3592,6 @@ cosmiconfig@^2.1.0, cosmiconfig@^2.1.1:
     parse-json "^2.2.0"
     require-from-string "^1.1.0"
 
-cosmiconfig@^3.1.0:
-  version "3.1.0"
-  resolved "https://registry.yarnpkg.com/cosmiconfig/-/cosmiconfig-3.1.0.tgz#640a94bf9847f321800403cd273af60665c73397"
-  dependencies:
-    is-directory "^0.3.1"
-    js-yaml "^3.9.0"
-    parse-json "^3.0.0"
-    require-from-string "^2.0.1"
-
 cpx@^1.5.0:
   version "1.5.0"
   resolved "https://registry.yarnpkg.com/cpx/-/cpx-1.5.0.tgz#185be018511d87270dedccc293171e37655ab88f"

From 3a2326625d743c571c9551df560762bbd90add2b Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Mon, 22 Jan 2018 21:03:45 +0100
Subject: [PATCH 05/13] FIX netlify

---
 package.json             | 2 ++
 scripts/netlify-build.sh | 0
 2 files changed, 2 insertions(+)
 mode change 100644 => 100755 scripts/netlify-build.sh

diff --git a/package.json b/package.json
index b6613eeb1c3f..d4024cf51265 100644
--- a/package.json
+++ b/package.json
@@ -42,6 +42,8 @@
     "babel-plugin-transform-runtime": "^6.23.0",
     "babel-polyfill": "^6.26.0",
     "babel-preset-env": "^1.6.1",
+    "babel-plugin-macros": "^2.0.0",
+    "babel-plugin-preval": "^1.6.3",
     "babel-preset-react": "^6.24.1",
     "babel-preset-stage-0": "^6.24.1",
     "chalk": "^2.3.0",
diff --git a/scripts/netlify-build.sh b/scripts/netlify-build.sh
old mode 100644
new mode 100755

From 73a1cb548bea7f0ef9c7cb4ce939323e32364aab Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Mon, 22 Jan 2018 23:27:53 +0100
Subject: [PATCH 06/13] CHANGE docs to use babel-plugin-macros over webpack
 __dirname injection

---
 docs/src/pages/basics/writing-stories/index.md | 12 +++++++-----
 1 file changed, 7 insertions(+), 5 deletions(-)

diff --git a/docs/src/pages/basics/writing-stories/index.md b/docs/src/pages/basics/writing-stories/index.md
index 24b902668415..9ff6b7250a6d 100644
--- a/docs/src/pages/basics/writing-stories/index.md
+++ b/docs/src/pages/basics/writing-stories/index.md
@@ -147,21 +147,23 @@ storiesOf('My App/Buttons/Emoji', module)
 
 The name is just a javascript string, by using a template literal, you can easily interpolate data.
 
-One example would be to use `__dirname`:
+One example would be to use `__dirname` combined with `babel-plugin-preval`:
 ```js
 import React from 'react';
+import preval from 'babel-plugin-preval/macro';
+
 import { storiesOf } from '@storybook/react';
 
-import BaseButton from './BaseButton';
+import BaseButton from '../components/BaseButton';
 
-const base = __dirname.replace(process.cwd(), '');
+const base = preval`module.exports = __dirname.replace(process.cwd() + '/', '')`;
 
-storiesOf(`Category|${base}/BaseButton`, module)
+storiesOf(`Other|${base}/Dirname Example`, module)
   .add('story 1', () => <BaseButton label="Story 1" />)
   .add('story 2', () => <BaseButton label="Story 2" />);
 ```
 
-*The usage of `__dirname` is dependent on webpack transforming it correctly. Either don't change the default config, add the nessesary config yourself, or import the storybook default, see [custom webpack config](/configurations/custom-webpack-config/#full-control-mode--default)*
+*This uses [babel-plugin-macros](https://github.com/kentcdodds/babel-plugin-macros) & [babel-plugin-preval](https://github.com/kentcdodds/babel-plugin-preval)*.
 
 ## Run multiple storybooks
 

From b8450c179d34d377559940f2ac0f00b8588736d1 Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Tue, 23 Jan 2018 15:08:27 +0100
Subject: [PATCH 07/13] SWITCH to babel-plugin-paths

---
 app/angular/package.json                      |  2 +-
 app/polymer/package.json                      |  2 +-
 app/react-native/package.json                 |  2 +-
 app/react/package.json                        |  2 +-
 app/vue/package.json                          |  2 +-
 .../src/pages/basics/writing-stories/index.md |  8 +++----
 examples/official-storybook/package.json      |  2 +-
 .../other-dirname.stories.storyshot           |  8 +++----
 .../stories/other-dirname.stories.js          |  4 +---
 lib/ui/src/modules/ui/libs/hierarchy.js       |  2 +-
 package.json                                  |  2 +-
 yarn.lock                                     | 21 +++++++++++++------
 12 files changed, 31 insertions(+), 26 deletions(-)

diff --git a/app/angular/package.json b/app/angular/package.json
index 7f7833e60b7b..27a7da812207 100644
--- a/app/angular/package.json
+++ b/app/angular/package.json
@@ -36,7 +36,7 @@
     "babel-core": "^6.26.0",
     "babel-loader": "^7.0.0",
     "babel-plugin-macros": "^2.0.0",
-    "babel-plugin-preval": "^1.6.3",
+    "babel-plugin-paths": "^1.0.0",
     "babel-plugin-react-docgen": "^1.8.2",
     "babel-preset-env": "^1.6.0",
     "babel-preset-react": "^6.24.1",
diff --git a/app/polymer/package.json b/app/polymer/package.json
index 5b746ae806b5..95ab04824c46 100644
--- a/app/polymer/package.json
+++ b/app/polymer/package.json
@@ -34,7 +34,7 @@
     "babel-core": "^6.26.0",
     "babel-loader": "^7.1.2",
     "babel-plugin-macros": "^2.0.0",
-    "babel-plugin-preval": "^1.6.3",
+    "babel-plugin-paths": "^1.0.0",
     "babel-plugin-react-docgen": "^1.8.2",
     "babel-plugin-transform-regenerator": "^6.26.0",
     "babel-plugin-transform-runtime": "^6.23.0",
diff --git a/app/react-native/package.json b/app/react-native/package.json
index 11730b51881c..7282178b00f3 100644
--- a/app/react-native/package.json
+++ b/app/react-native/package.json
@@ -34,7 +34,7 @@
     "autoprefixer": "^7.2.5",
     "babel-loader": "^7.1.2",
     "babel-plugin-macros": "^2.0.0",
-    "babel-plugin-preval": "^1.6.3",
+    "babel-plugin-paths": "^1.0.0",
     "babel-plugin-syntax-async-functions": "^6.13.0",
     "babel-plugin-syntax-trailing-function-commas": "^6.22.0",
     "babel-plugin-transform-class-properties": "^6.24.1",
diff --git a/app/react/package.json b/app/react/package.json
index 647c7daf5601..3b4cda6ff293 100644
--- a/app/react/package.json
+++ b/app/react/package.json
@@ -35,7 +35,7 @@
     "autoprefixer": "^7.2.5",
     "babel-loader": "^7.1.2",
     "babel-plugin-macros": "^2.0.0",
-    "babel-plugin-preval": "^1.6.3",
+    "babel-plugin-paths": "^1.0.0",
     "babel-plugin-react-docgen": "^1.8.2",
     "babel-plugin-transform-regenerator": "^6.26.0",
     "babel-plugin-transform-runtime": "^6.23.0",
diff --git a/app/vue/package.json b/app/vue/package.json
index 102a6855ea95..35bfba490475 100644
--- a/app/vue/package.json
+++ b/app/vue/package.json
@@ -33,7 +33,7 @@
     "autoprefixer": "^7.2.5",
     "babel-loader": "^7.1.2",
     "babel-plugin-macros": "^2.0.0",
-    "babel-plugin-preval": "^1.6.3",
+    "babel-plugin-paths": "^1.0.0",
     "babel-plugin-react-docgen": "^1.8.2",
     "babel-plugin-transform-regenerator": "^6.26.0",
     "babel-plugin-transform-runtime": "^6.23.0",
diff --git a/docs/src/pages/basics/writing-stories/index.md b/docs/src/pages/basics/writing-stories/index.md
index 9ff6b7250a6d..458f49e3d7e7 100644
--- a/docs/src/pages/basics/writing-stories/index.md
+++ b/docs/src/pages/basics/writing-stories/index.md
@@ -147,23 +147,21 @@ storiesOf('My App/Buttons/Emoji', module)
 
 The name is just a javascript string, by using a template literal, you can easily interpolate data.
 
-One example would be to use `__dirname` combined with `babel-plugin-preval`:
+One example would be to use `base` from [`babel-plugin-paths`](https://github.com/storybooks/babel-plugin-paths):
 ```js
 import React from 'react';
-import preval from 'babel-plugin-preval/macro';
+import base from 'babel-plugin-paths/macro';
 
 import { storiesOf } from '@storybook/react';
 
 import BaseButton from '../components/BaseButton';
 
-const base = preval`module.exports = __dirname.replace(process.cwd() + '/', '')`;
-
 storiesOf(`Other|${base}/Dirname Example`, module)
   .add('story 1', () => <BaseButton label="Story 1" />)
   .add('story 2', () => <BaseButton label="Story 2" />);
 ```
 
-*This uses [babel-plugin-macros](https://github.com/kentcdodds/babel-plugin-macros) & [babel-plugin-preval](https://github.com/kentcdodds/babel-plugin-preval)*.
+*This uses [babel-plugin-macros](https://github.com/kentcdodds/babel-plugin-macros)*.
 
 ## Run multiple storybooks
 
diff --git a/examples/official-storybook/package.json b/examples/official-storybook/package.json
index 3a953507316a..b45250343b3e 100644
--- a/examples/official-storybook/package.json
+++ b/examples/official-storybook/package.json
@@ -26,7 +26,7 @@
     "@storybook/components": "^3.4.0-alpha.5",
     "@storybook/react": "^3.4.0-alpha.5",
     "babel-jest": "^21.2.0",
-    "babel-plugin-preval": "^1.6.3",
+    "babel-plugin-paths": "^1.0.0",
     "enzyme": "^3.3.0",
     "enzyme-adapter-react-16": "^1.1.0",
     "enzyme-to-json": "^3.2.2",
diff --git a/examples/official-storybook/stories/__snapshots__/other-dirname.stories.storyshot b/examples/official-storybook/stories/__snapshots__/other-dirname.stories.storyshot
index 9a21a1288bd4..790724334a83 100644
--- a/examples/official-storybook/stories/__snapshots__/other-dirname.stories.storyshot
+++ b/examples/official-storybook/stories/__snapshots__/other-dirname.stories.storyshot
@@ -1,24 +1,24 @@
 // Jest Snapshot v1, https://goo.gl/fbAQLP
 
-exports[`Storyshots Other|/examples/official-storybook/stories/Dirname Example story 1 1`] = `
+exports[`Storyshots Other|/stories//Dirname Example story 1 1`] = `
 <button>
   Story 1
 </button>
 `;
 
-exports[`Storyshots Other|/examples/official-storybook/stories/Dirname Example story 2 1`] = `
+exports[`Storyshots Other|/stories//Dirname Example story 2 1`] = `
 <button>
   Story 2
 </button>
 `;
 
-exports[`Storyshots Other|examples/official-storybook/stories/Dirname Example story 1 1`] = `
+exports[`Storyshots Other|/stories/Dirname Example story 1 1`] = `
 <button>
   Story 1
 </button>
 `;
 
-exports[`Storyshots Other|examples/official-storybook/stories/Dirname Example story 2 1`] = `
+exports[`Storyshots Other|/stories/Dirname Example story 2 1`] = `
 <button>
   Story 2
 </button>
diff --git a/examples/official-storybook/stories/other-dirname.stories.js b/examples/official-storybook/stories/other-dirname.stories.js
index 8703d7b103c6..b970aca668c8 100644
--- a/examples/official-storybook/stories/other-dirname.stories.js
+++ b/examples/official-storybook/stories/other-dirname.stories.js
@@ -1,12 +1,10 @@
 import React from 'react';
-import preval from 'babel-plugin-preval/macro';
+import base from 'babel-plugin-paths/macro';
 
 import { storiesOf } from '@storybook/react';
 
 import BaseButton from '../components/BaseButton';
 
-const base = preval`module.exports = __dirname.replace(process.cwd() + '/', '')`;
-
 storiesOf(`Other|${base}/Dirname Example`, module)
   .add('story 1', () => <BaseButton label="Story 1" />)
   .add('story 2', () => <BaseButton label="Story 2" />);
diff --git a/lib/ui/src/modules/ui/libs/hierarchy.js b/lib/ui/src/modules/ui/libs/hierarchy.js
index 397a3f6a2362..1b80b6f72ca3 100644
--- a/lib/ui/src/modules/ui/libs/hierarchy.js
+++ b/lib/ui/src/modules/ui/libs/hierarchy.js
@@ -105,7 +105,7 @@ export function resolveStoryHierarchy(storyName = '', hierarchySeparator) {
     return [storyName];
   }
 
-  return storyName.split(new RegExp(hierarchySeparator));
+  return storyName.split(new RegExp(hierarchySeparator)).filter(segment => !!segment);
 }
 
 export function prepareStoriesForHierarchy(stories, hierarchySeparator, hierarchyRootSeparator) {
diff --git a/package.json b/package.json
index 5a0e5ab1fec8..524a812e9352 100644
--- a/package.json
+++ b/package.json
@@ -43,7 +43,7 @@
     "babel-polyfill": "^6.26.0",
     "babel-preset-env": "^1.6.1",
     "babel-plugin-macros": "^2.0.0",
-    "babel-plugin-preval": "^1.6.3",
+    "babel-plugin-paths": "^1.0.0",
     "babel-preset-react": "^6.24.1",
     "babel-preset-stage-0": "^6.24.1",
     "chalk": "^2.3.0",
diff --git a/yarn.lock b/yarn.lock
index 3c5791924039..c7f6a2030b51 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1185,6 +1185,12 @@ babel-loader@7.1.2, babel-loader@^7.0.0, babel-loader@^7.1.2:
     loader-utils "^1.0.2"
     mkdirp "^0.5.1"
 
+babel-macros@^1.2.0:
+  version "1.2.0"
+  resolved "https://registry.yarnpkg.com/babel-macros/-/babel-macros-1.2.0.tgz#39e47ed6d286d4a98f1948d8bab45dac17e4e2d4"
+  dependencies:
+    cosmiconfig "3.1.0"
+
 babel-messages@^6.23.0:
   version "6.23.0"
   resolved "https://registry.yarnpkg.com/babel-messages/-/babel-messages-6.23.0.tgz#f3cdf4703858035b2a2951c6ec5edf6c62f2630e"
@@ -1318,14 +1324,13 @@ babel-plugin-minify-type-constructors@^0.2.0:
   dependencies:
     babel-helper-is-void-0 "^0.2.0"
 
-babel-plugin-preval@^1.6.3:
-  version "1.6.3"
-  resolved "https://registry.yarnpkg.com/babel-plugin-preval/-/babel-plugin-preval-1.6.3.tgz#df784357410a9762f01bf0c5705e2c070eac3ccb"
+babel-plugin-paths@^1.0.0:
+  version "1.0.0"
+  resolved "https://registry.yarnpkg.com/babel-plugin-paths/-/babel-plugin-paths-1.0.0.tgz#01b2988dcbb98eabf1785aaa144cebd0ecda44b1"
   dependencies:
+    babel-macros "^1.2.0"
     babel-plugin-macros "^2.0.0"
-    babel-register "^6.26.0"
-    babylon "^6.18.0"
-    require-from-string "^2.0.1"
+    find-root "^1.1.0"
 
 babel-plugin-react-docgen@^1.8.2:
   version "1.8.2"
@@ -5605,6 +5610,10 @@ find-parent-dir@^0.3.0:
   version "0.3.0"
   resolved "https://registry.yarnpkg.com/find-parent-dir/-/find-parent-dir-0.3.0.tgz#33c44b429ab2b2f0646299c5f9f718f376ff8d54"
 
+find-root@^1.1.0:
+  version "1.1.0"
+  resolved "https://registry.yarnpkg.com/find-root/-/find-root-1.1.0.tgz#abcfc8ba76f708c42a97b3d685b7e9450bfb9ce4"
+
 find-up@^1.0.0:
   version "1.1.2"
   resolved "https://registry.yarnpkg.com/find-up/-/find-up-1.1.2.tgz#6b2e9822b1a2ce0a60ab64d610eccad53cb24d0f"

From 99eb4382e5ede30d3727251d292b7ad626b788af Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Tue, 23 Jan 2018 17:39:50 +0100
Subject: [PATCH 08/13] RENAME babel-plugin-paths to paths.macro && SORT
 package.json

---
 addons/notes/package.json                     |  4 ++--
 addons/storyshots/package.json                |  4 ++--
 addons/viewport/package.json                  |  4 ++--
 app/angular/package.json                      |  2 +-
 app/polymer/package.json                      |  2 +-
 app/react-native/package.json                 |  2 +-
 app/react/package.json                        |  2 +-
 app/vue/package.json                          |  2 +-
 .../src/pages/basics/writing-stories/index.md |  4 ++--
 examples/angular-cli/package.json             | 10 +++++-----
 examples/cra-kitchen-sink/package.json        |  4 ++--
 examples/official-storybook/package.json      | 10 +++++-----
 .../stories/other-dirname.stories.js          |  2 +-
 examples/polymer-cli/package.json             |  2 +-
 examples/vue-kitchen-sink/package.json        | 20 +++++++++----------
 lib/cli/package.json                          |  4 ++--
 lib/components/package.json                   | 12 +++++------
 lib/core/package.json                         |  2 +-
 lib/ui/package.json                           |  8 ++++----
 package.json                                  |  2 +-
 yarn.lock                                     | 16 +++++++--------
 21 files changed, 59 insertions(+), 59 deletions(-)

diff --git a/addons/notes/package.json b/addons/notes/package.json
index d53d0a29c021..1a0933ef0773 100644
--- a/addons/notes/package.json
+++ b/addons/notes/package.json
@@ -4,8 +4,8 @@
   "description": "Write notes for your Storybook stories.",
   "keywords": [
     "addon",
-    "storybook",
-    "notes"
+    "notes",
+    "storybook"
   ],
   "license": "MIT",
   "main": "dist/index.js",
diff --git a/addons/storyshots/package.json b/addons/storyshots/package.json
index b031ab1a4613..d1a850671117 100644
--- a/addons/storyshots/package.json
+++ b/addons/storyshots/package.json
@@ -11,9 +11,9 @@
   },
   "scripts": {
     "build-storybook": "build-storybook",
+    "example": "jest storyshot.test",
     "prepare": "node ../../scripts/prepare.js",
-    "storybook": "start-storybook -p 6006",
-    "example": "jest storyshot.test"
+    "storybook": "start-storybook -p 6006"
   },
   "dependencies": {
     "@storybook/channels": "^3.4.0-alpha.5",
diff --git a/addons/viewport/package.json b/addons/viewport/package.json
index befd902f007b..c6a2152d9590 100644
--- a/addons/viewport/package.json
+++ b/addons/viewport/package.json
@@ -2,14 +2,14 @@
   "name": "@storybook/addon-viewport",
   "version": "3.4.0-alpha.5",
   "description": "Storybook addon to change the viewport size to mobile",
-  "main": "register.js",
   "keywords": [
     "storybook"
   ],
+  "license": "MIT",
+  "main": "register.js",
   "scripts": {
     "prepare": "node ../../scripts/prepare.js"
   },
-  "license": "MIT",
   "dependencies": {
     "@storybook/components": "^3.4.0-alpha.5",
     "global": "^4.3.2",
diff --git a/app/angular/package.json b/app/angular/package.json
index 27a7da812207..d71f3c138400 100644
--- a/app/angular/package.json
+++ b/app/angular/package.json
@@ -36,7 +36,6 @@
     "babel-core": "^6.26.0",
     "babel-loader": "^7.0.0",
     "babel-plugin-macros": "^2.0.0",
-    "babel-plugin-paths": "^1.0.0",
     "babel-plugin-react-docgen": "^1.8.2",
     "babel-preset-env": "^1.6.0",
     "babel-preset-react": "^6.24.1",
@@ -63,6 +62,7 @@
     "lodash.pick": "^4.4.0",
     "markdown-loader": "^2.0.2",
     "node-sass": "^4.7.2",
+    "paths.macro": "^1.0.1",
     "postcss-flexbugs-fixes": "^3.3.0",
     "postcss-loader": "^2.0.10",
     "prop-types": "^15.5.10",
diff --git a/app/polymer/package.json b/app/polymer/package.json
index 95ab04824c46..72f28da4485e 100644
--- a/app/polymer/package.json
+++ b/app/polymer/package.json
@@ -34,7 +34,6 @@
     "babel-core": "^6.26.0",
     "babel-loader": "^7.1.2",
     "babel-plugin-macros": "^2.0.0",
-    "babel-plugin-paths": "^1.0.0",
     "babel-plugin-react-docgen": "^1.8.2",
     "babel-plugin-transform-regenerator": "^6.26.0",
     "babel-plugin-transform-runtime": "^6.23.0",
@@ -62,6 +61,7 @@
     "json-stringify-safe": "^5.0.1",
     "json5": "^0.5.1",
     "lodash.pick": "^4.4.0",
+    "paths.macro": "^1.0.1",
     "polymer-webpack-loader": "2.0.1",
     "postcss-flexbugs-fixes": "^3.3.0",
     "postcss-loader": "^2.0.8",
diff --git a/app/react-native/package.json b/app/react-native/package.json
index 7282178b00f3..a0a3b2ca7937 100644
--- a/app/react-native/package.json
+++ b/app/react-native/package.json
@@ -34,7 +34,6 @@
     "autoprefixer": "^7.2.5",
     "babel-loader": "^7.1.2",
     "babel-plugin-macros": "^2.0.0",
-    "babel-plugin-paths": "^1.0.0",
     "babel-plugin-syntax-async-functions": "^6.13.0",
     "babel-plugin-syntax-trailing-function-commas": "^6.22.0",
     "babel-plugin-transform-class-properties": "^6.24.1",
@@ -58,6 +57,7 @@
     "html-webpack-plugin": "^2.30.1",
     "json-loader": "^0.5.7",
     "json5": "^0.5.1",
+    "paths.macro": "^1.0.1",
     "postcss-loader": "^2.0.10",
     "prop-types": "^15.6.0",
     "react-native-compat": "^1.0.0",
diff --git a/app/react/package.json b/app/react/package.json
index 3b4cda6ff293..206ea37e26a2 100644
--- a/app/react/package.json
+++ b/app/react/package.json
@@ -35,7 +35,6 @@
     "autoprefixer": "^7.2.5",
     "babel-loader": "^7.1.2",
     "babel-plugin-macros": "^2.0.0",
-    "babel-plugin-paths": "^1.0.0",
     "babel-plugin-react-docgen": "^1.8.2",
     "babel-plugin-transform-regenerator": "^6.26.0",
     "babel-plugin-transform-runtime": "^6.23.0",
@@ -67,6 +66,7 @@
     "lodash.flattendeep": "^4.4.0",
     "markdown-loader": "^2.0.2",
     "npmlog": "^4.1.2",
+    "paths.macro": "^1.0.1",
     "postcss-flexbugs-fixes": "^3.3.0",
     "postcss-loader": "^2.0.10",
     "prop-types": "^15.6.0",
diff --git a/app/vue/package.json b/app/vue/package.json
index 35bfba490475..f232cb17b082 100644
--- a/app/vue/package.json
+++ b/app/vue/package.json
@@ -33,7 +33,6 @@
     "autoprefixer": "^7.2.5",
     "babel-loader": "^7.1.2",
     "babel-plugin-macros": "^2.0.0",
-    "babel-plugin-paths": "^1.0.0",
     "babel-plugin-react-docgen": "^1.8.2",
     "babel-plugin-transform-regenerator": "^6.26.0",
     "babel-plugin-transform-runtime": "^6.23.0",
@@ -61,6 +60,7 @@
     "json-stringify-safe": "^5.0.1",
     "json5": "^0.5.1",
     "markdown-loader": "^2.0.2",
+    "paths.macro": "^1.0.1",
     "postcss-flexbugs-fixes": "^3.3.0",
     "postcss-loader": "^2.0.10",
     "prop-types": "^15.6.0",
diff --git a/docs/src/pages/basics/writing-stories/index.md b/docs/src/pages/basics/writing-stories/index.md
index 3d1f19afbe6b..ba880d94af43 100644
--- a/docs/src/pages/basics/writing-stories/index.md
+++ b/docs/src/pages/basics/writing-stories/index.md
@@ -147,10 +147,10 @@ storiesOf('My App/Buttons/Emoji', module)
 
 The name is just a javascript string, by using a template literal, you can easily interpolate data.
 
-One example would be to use `base` from [`babel-plugin-paths`](https://github.com/storybooks/babel-plugin-paths):
+One example would be to use `base` from [`paths.macro`](https://github.com/storybooks/paths.macro):
 ```js
 import React from 'react';
-import base from 'babel-plugin-paths/macro';
+import base from 'paths.macro';
 
 import { storiesOf } from '@storybook/react';
 
diff --git a/examples/angular-cli/package.json b/examples/angular-cli/package.json
index c85d1625f246..63b495eca856 100644
--- a/examples/angular-cli/package.json
+++ b/examples/angular-cli/package.json
@@ -1,17 +1,17 @@
 {
   "name": "angular-cli",
   "version": "3.4.0-alpha.5",
+  "private": true,
   "license": "MIT",
   "scripts": {
-    "ng": "ng",
-    "start": "ng serve",
     "build": "ng build",
-    "test": "ng test",
+    "build-storybook": "build-storybook -s src",
     "e2e": "ng e2e",
+    "ng": "ng",
+    "start": "ng serve",
     "storybook": "start-storybook -p 9008 -s src/assets",
-    "build-storybook": "build-storybook -s src"
+    "test": "ng test"
   },
-  "private": true,
   "dependencies": {
     "@angular/animations": "^5.2.1",
     "@angular/common": "^5.2.1",
diff --git a/examples/cra-kitchen-sink/package.json b/examples/cra-kitchen-sink/package.json
index 281278acb8ba..40cc99ace8ea 100644
--- a/examples/cra-kitchen-sink/package.json
+++ b/examples/cra-kitchen-sink/package.json
@@ -1,6 +1,7 @@
 {
   "name": "cra-kitchen-sink",
   "version": "3.4.0-alpha.5",
+  "private": true,
   "scripts": {
     "build": "react-scripts build",
     "build-storybook": "build-storybook -s public",
@@ -41,6 +42,5 @@
     "enzyme-to-json": "^3.2.2",
     "jest": "^22.1.4",
     "react-scripts": "^1.1.0"
-  },
-  "private": true
+  }
 }
diff --git a/examples/official-storybook/package.json b/examples/official-storybook/package.json
index b45250343b3e..d5f3449ac801 100644
--- a/examples/official-storybook/package.json
+++ b/examples/official-storybook/package.json
@@ -1,12 +1,13 @@
 {
   "name": "official-storybook",
   "version": "3.4.0-alpha.5",
+  "private": true,
   "scripts": {
     "build-storybook": "build-storybook -c ./",
-    "storybook": "start-storybook -p 9010 -c ./",
     "chromatic": "chromatic test --storybook-addon --exit-zero-on-changes --app-code ab7m45tp9p",
     "generate-addon-jest-testresults": "jest --config=tests/addon-jest.config.json --json --outputFile=stories/addon-jest.testresults.json",
-    "image-snapshots": "yarn run build-storybook && jest --projects=./image-snapshots"
+    "image-snapshots": "yarn run build-storybook && jest --projects=./image-snapshots",
+    "storybook": "start-storybook -p 9010 -c ./"
   },
   "devDependencies": {
     "@storybook/addon-a11y": "^3.4.0-alpha.5",
@@ -26,7 +27,6 @@
     "@storybook/components": "^3.4.0-alpha.5",
     "@storybook/react": "^3.4.0-alpha.5",
     "babel-jest": "^21.2.0",
-    "babel-plugin-paths": "^1.0.0",
     "enzyme": "^3.3.0",
     "enzyme-adapter-react-16": "^1.1.0",
     "enzyme-to-json": "^3.2.2",
@@ -34,11 +34,11 @@
     "format-json": "^1.0.3",
     "global": "^4.3.2",
     "jest": "^21.2.1",
+    "paths.macro": "^1.0.1",
     "prop-types": "^15.6.0",
     "react": "^16.2.0",
     "react-chromatic": "^0.7.8",
     "react-dom": "^16.2.0",
     "uuid": "^3.2.1"
-  },
-  "private": true
+  }
 }
diff --git a/examples/official-storybook/stories/other-dirname.stories.js b/examples/official-storybook/stories/other-dirname.stories.js
index b970aca668c8..e1b20029b7c0 100644
--- a/examples/official-storybook/stories/other-dirname.stories.js
+++ b/examples/official-storybook/stories/other-dirname.stories.js
@@ -1,5 +1,5 @@
 import React from 'react';
-import base from 'babel-plugin-paths/macro';
+import base from 'paths.macro';
 
 import { storiesOf } from '@storybook/react';
 
diff --git a/examples/polymer-cli/package.json b/examples/polymer-cli/package.json
index 0e54c98d9404..79dc157e7591 100644
--- a/examples/polymer-cli/package.json
+++ b/examples/polymer-cli/package.json
@@ -1,11 +1,11 @@
 {
   "name": "polymer-cli",
   "version": "3.4.0-alpha.5",
+  "private": true,
   "scripts": {
     "start": "webpack-dev-server",
     "storybook": "start-storybook -p 9001 -c .storybook"
   },
-  "private": true,
   "dependencies": {
     "@polymer/polymer": "^2.2.0",
     "@storybook/addon-actions": "^3.4.0-alpha.5",
diff --git a/examples/vue-kitchen-sink/package.json b/examples/vue-kitchen-sink/package.json
index 1a8005d95efa..46e4598a9ad4 100644
--- a/examples/vue-kitchen-sink/package.json
+++ b/examples/vue-kitchen-sink/package.json
@@ -2,6 +2,16 @@
   "name": "vue-example",
   "version": "3.4.0-alpha.5",
   "private": true,
+  "scripts": {
+    "build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
+    "build-storybook": "build-storybook -s public",
+    "dev": "cross-env NODE_ENV=development webpack-dev-server --open --hot",
+    "storybook": "start-storybook -p 9009 -s public"
+  },
+  "dependencies": {
+    "vue": "^2.5.13",
+    "vuex": "^3.0.0"
+  },
   "devDependencies": {
     "@storybook/addon-actions": "^3.4.0-alpha.5",
     "@storybook/addon-centered": "^3.4.0-alpha.5",
@@ -25,15 +35,5 @@
     "vue-template-compiler": "^2.5.13",
     "webpack": "^3.10.0",
     "webpack-dev-server": "^2.11.1"
-  },
-  "dependencies": {
-    "vue": "^2.5.13",
-    "vuex": "^3.0.0"
-  },
-  "scripts": {
-    "dev": "cross-env NODE_ENV=development webpack-dev-server --open --hot",
-    "build": "cross-env NODE_ENV=production webpack --progress --hide-modules",
-    "storybook": "start-storybook -p 9009 -s public",
-    "build-storybook": "build-storybook -s public"
   }
 }
diff --git a/lib/cli/package.json b/lib/cli/package.json
index e7ae67a409d9..3d4fee45615e 100644
--- a/lib/cli/package.json
+++ b/lib/cli/package.json
@@ -21,8 +21,8 @@
     "url": "https://github.com/storybooks/storybook.git"
   },
   "scripts": {
-    "test-latest-cra": "cd test && ./test_latest_cra.sh",
-    "test": "cd test && ./run_tests.sh"
+    "test": "cd test && ./run_tests.sh",
+    "test-latest-cra": "cd test && ./test_latest_cra.sh"
   },
   "dependencies": {
     "@storybook/codemod": "^3.4.0-alpha.5",
diff --git a/lib/components/package.json b/lib/components/package.json
index 59037cb55a09..29bc02e3f6bf 100644
--- a/lib/components/package.json
+++ b/lib/components/package.json
@@ -10,22 +10,22 @@
     "url": "https://github.com/storybooks/storybook.git"
   },
   "scripts": {
+    "build-storybook": "build-storybook",
     "prepare": "node ../../scripts/prepare.js",
-    "storybook": "start-storybook -p 6006",
-    "build-storybook": "build-storybook"
+    "storybook": "start-storybook -p 6006"
   },
   "dependencies": {
     "glamor": "^2.20.40",
     "glamorous": "^4.11.4",
     "prop-types": "^15.6.0"
   },
-  "peerDependencies": {
-    "react": "*",
-    "react-dom": "*"
-  },
   "devDependencies": {
     "@storybook/addon-actions": "^3.4.0-alpha.5",
     "@storybook/addon-knobs": "^3.4.0-alpha.5",
     "@storybook/react": "^3.4.0-alpha.5"
+  },
+  "peerDependencies": {
+    "react": "*",
+    "react-dom": "*"
   }
 }
diff --git a/lib/core/package.json b/lib/core/package.json
index 7ed5c05372ce..7e0bfed7d2d8 100644
--- a/lib/core/package.json
+++ b/lib/core/package.json
@@ -31,10 +31,10 @@
     "postcss-flexbugs-fixes": "^3.2.0",
     "postcss-loader": "^2.0.10",
     "prop-types": "^15.5.10",
+    "qs": "^6.5.1",
     "react": "^16.0.0",
     "react-dom": "^16.0.0",
     "style-loader": "^0.19.1",
-    "qs": "^6.5.1",
     "url-loader": "^0.6.2"
   },
   "devDependencies": {
diff --git a/lib/ui/package.json b/lib/ui/package.json
index 3a410b9bdff5..77bfd24bf00a 100644
--- a/lib/ui/package.json
+++ b/lib/ui/package.json
@@ -39,12 +39,12 @@
     "react-treebeard": "^2.1.0",
     "redux": "^3.7.2"
   },
-  "peerDependencies": {
-    "react": "*",
-    "react-dom": "*"
-  },
   "devDependencies": {
     "@storybook/addon-actions": "^3.4.0-alpha.5",
     "@storybook/react": "^3.4.0-alpha.5"
+  },
+  "peerDependencies": {
+    "react": "*",
+    "react-dom": "*"
   }
 }
diff --git a/package.json b/package.json
index 524a812e9352..76de6d3f4857 100644
--- a/package.json
+++ b/package.json
@@ -43,7 +43,7 @@
     "babel-polyfill": "^6.26.0",
     "babel-preset-env": "^1.6.1",
     "babel-plugin-macros": "^2.0.0",
-    "babel-plugin-paths": "^1.0.0",
+    "paths.macro": "^1.0.1",
     "babel-preset-react": "^6.24.1",
     "babel-preset-stage-0": "^6.24.1",
     "chalk": "^2.3.0",
diff --git a/yarn.lock b/yarn.lock
index c7f6a2030b51..81b0d2bf8cd1 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -1324,14 +1324,6 @@ babel-plugin-minify-type-constructors@^0.2.0:
   dependencies:
     babel-helper-is-void-0 "^0.2.0"
 
-babel-plugin-paths@^1.0.0:
-  version "1.0.0"
-  resolved "https://registry.yarnpkg.com/babel-plugin-paths/-/babel-plugin-paths-1.0.0.tgz#01b2988dcbb98eabf1785aaa144cebd0ecda44b1"
-  dependencies:
-    babel-macros "^1.2.0"
-    babel-plugin-macros "^2.0.0"
-    find-root "^1.1.0"
-
 babel-plugin-react-docgen@^1.8.2:
   version "1.8.2"
   resolved "https://registry.yarnpkg.com/babel-plugin-react-docgen/-/babel-plugin-react-docgen-1.8.2.tgz#4615da43588c8cf5bdcae028f217954c70e6770b"
@@ -10980,6 +10972,14 @@ path@^0.12.7:
     process "^0.11.1"
     util "^0.10.3"
 
+paths.macro@^1.0.1:
+  version "1.0.1"
+  resolved "https://registry.yarnpkg.com/paths.macro/-/paths.macro-1.0.1.tgz#faa4667e5454f5ab9812e9a9af687a683d02330f"
+  dependencies:
+    babel-macros "^1.2.0"
+    babel-plugin-macros "^2.0.0"
+    find-root "^1.1.0"
+
 pause-stream@0.0.11:
   version "0.0.11"
   resolved "https://registry.yarnpkg.com/pause-stream/-/pause-stream-0.0.11.tgz#fe5a34b0cbce12b5aa6a2b403ee2e73b602f1445"

From 6d3aa7e45f33006be0aaa2e070a8da7c2417741a Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Tue, 23 Jan 2018 18:34:14 +0100
Subject: [PATCH 09/13] FIX windows BS paths containing a slash in the freaking
 wrong direction, total BS

---
 examples/official-storybook/config.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/examples/official-storybook/config.js b/examples/official-storybook/config.js
index e0a9c368c68f..ed7b4ced1565 100644
--- a/examples/official-storybook/config.js
+++ b/examples/official-storybook/config.js
@@ -7,7 +7,7 @@ import addHeadWarning from './head-warning';
 addHeadWarning('Preview');
 
 setOptions({
-  hierarchySeparator: /\/|\./,
+  hierarchySeparator: /\/|\.|\\/,
   hierarchyRootSeparator: /\|/,
 });
 

From 955debb3b1a16877512b2cdb78174a9c0d33eb68 Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Thu, 25 Jan 2018 08:56:22 +0100
Subject: [PATCH 10/13] Revert "FIX windows BS paths containing a slash in the
 freaking wrong direction, total BS"

This reverts commit 6d3aa7e45f33006be0aaa2e070a8da7c2417741a.
---
 examples/official-storybook/config.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/examples/official-storybook/config.js b/examples/official-storybook/config.js
index ed7b4ced1565..e0a9c368c68f 100644
--- a/examples/official-storybook/config.js
+++ b/examples/official-storybook/config.js
@@ -7,7 +7,7 @@ import addHeadWarning from './head-warning';
 addHeadWarning('Preview');
 
 setOptions({
-  hierarchySeparator: /\/|\.|\\/,
+  hierarchySeparator: /\/|\./,
   hierarchyRootSeparator: /\|/,
 });
 

From abbe3d30d275182baf61650da62474e4a16d4fd0 Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Thu, 25 Jan 2018 09:03:02 +0100
Subject: [PATCH 11/13] CLEANUP && UPDATE paths.macro

---
 app/angular/package.json                 | 1 -
 app/polymer/package.json                 | 1 -
 app/react-native/package.json            | 1 -
 app/react/package.json                   | 1 -
 app/vue/package.json                     | 1 -
 examples/official-storybook/package.json | 2 +-
 package.json                             | 2 +-
 7 files changed, 2 insertions(+), 7 deletions(-)

diff --git a/app/angular/package.json b/app/angular/package.json
index d71f3c138400..a1b7d57914ed 100644
--- a/app/angular/package.json
+++ b/app/angular/package.json
@@ -62,7 +62,6 @@
     "lodash.pick": "^4.4.0",
     "markdown-loader": "^2.0.2",
     "node-sass": "^4.7.2",
-    "paths.macro": "^1.0.1",
     "postcss-flexbugs-fixes": "^3.3.0",
     "postcss-loader": "^2.0.10",
     "prop-types": "^15.5.10",
diff --git a/app/polymer/package.json b/app/polymer/package.json
index f927e6ceb31f..68a17b6ec095 100644
--- a/app/polymer/package.json
+++ b/app/polymer/package.json
@@ -61,7 +61,6 @@
     "json-stringify-safe": "^5.0.1",
     "json5": "^0.5.1",
     "lodash.pick": "^4.4.0",
-    "paths.macro": "^1.0.1",
     "polymer-webpack-loader": "2.0.1",
     "postcss-flexbugs-fixes": "^3.3.0",
     "postcss-loader": "^2.0.8",
diff --git a/app/react-native/package.json b/app/react-native/package.json
index a0a3b2ca7937..9f9743fab0db 100644
--- a/app/react-native/package.json
+++ b/app/react-native/package.json
@@ -57,7 +57,6 @@
     "html-webpack-plugin": "^2.30.1",
     "json-loader": "^0.5.7",
     "json5": "^0.5.1",
-    "paths.macro": "^1.0.1",
     "postcss-loader": "^2.0.10",
     "prop-types": "^15.6.0",
     "react-native-compat": "^1.0.0",
diff --git a/app/react/package.json b/app/react/package.json
index 206ea37e26a2..fc6cf3adb03c 100644
--- a/app/react/package.json
+++ b/app/react/package.json
@@ -66,7 +66,6 @@
     "lodash.flattendeep": "^4.4.0",
     "markdown-loader": "^2.0.2",
     "npmlog": "^4.1.2",
-    "paths.macro": "^1.0.1",
     "postcss-flexbugs-fixes": "^3.3.0",
     "postcss-loader": "^2.0.10",
     "prop-types": "^15.6.0",
diff --git a/app/vue/package.json b/app/vue/package.json
index f232cb17b082..a006f21dd590 100644
--- a/app/vue/package.json
+++ b/app/vue/package.json
@@ -60,7 +60,6 @@
     "json-stringify-safe": "^5.0.1",
     "json5": "^0.5.1",
     "markdown-loader": "^2.0.2",
-    "paths.macro": "^1.0.1",
     "postcss-flexbugs-fixes": "^3.3.0",
     "postcss-loader": "^2.0.10",
     "prop-types": "^15.6.0",
diff --git a/examples/official-storybook/package.json b/examples/official-storybook/package.json
index 88e26756e8ba..67d806342a7a 100644
--- a/examples/official-storybook/package.json
+++ b/examples/official-storybook/package.json
@@ -34,7 +34,7 @@
     "format-json": "^1.0.3",
     "global": "^4.3.2",
     "jest": "^21.2.1",
-    "paths.macro": "^1.0.1",
+    "paths.macro": "^2.0.0",
     "prop-types": "^15.6.0",
     "react": "^16.2.0",
     "react-chromatic": "^0.7.9",
diff --git a/package.json b/package.json
index 76de6d3f4857..696f77822875 100644
--- a/package.json
+++ b/package.json
@@ -43,7 +43,7 @@
     "babel-polyfill": "^6.26.0",
     "babel-preset-env": "^1.6.1",
     "babel-plugin-macros": "^2.0.0",
-    "paths.macro": "^1.0.1",
+    "paths.macro": "^2.0.0",
     "babel-preset-react": "^6.24.1",
     "babel-preset-stage-0": "^6.24.1",
     "chalk": "^2.3.0",

From a69f8a9104eabd5b8af7978f50f6896517936099 Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Fri, 26 Jan 2018 20:36:07 +0100
Subject: [PATCH 12/13] UPDATE yarn.lock

---
 yarn.lock | 32 +++++++++++++++++++++++++++++---
 1 file changed, 29 insertions(+), 3 deletions(-)

diff --git a/yarn.lock b/yarn.lock
index f204034ef52e..0219070daa81 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -9184,6 +9184,10 @@ lodash.defaults@^4.2.0:
   version "4.2.0"
   resolved "https://registry.yarnpkg.com/lodash.defaults/-/lodash.defaults-4.2.0.tgz#d09178716ffea4dde9e5fb7b37f6f0802274580c"
 
+lodash.endswith@^4.2.1:
+  version "4.2.1"
+  resolved "https://registry.yarnpkg.com/lodash.endswith/-/lodash.endswith-4.2.1.tgz#fed59ac1738ed3e236edd7064ec456448b37bc09"
+
 lodash.escape@^3.0.0:
   version "3.2.0"
   resolved "https://registry.yarnpkg.com/lodash.escape/-/lodash.escape-3.2.0.tgz#995ee0dc18c1b48cc92effae71a10aab5b487698"
@@ -9217,6 +9221,10 @@ lodash.isequal@^3.0:
     lodash._baseisequal "^3.0.0"
     lodash._bindcallback "^3.0.0"
 
+lodash.isfunction@^3.0.8:
+  version "3.0.8"
+  resolved "https://registry.yarnpkg.com/lodash.isfunction/-/lodash.isfunction-3.0.8.tgz#4db709fc81bc4a8fd7127a458a5346c5cdce2c6b"
+
 lodash.isobject@^3.0.2:
   version "3.0.2"
   resolved "https://registry.yarnpkg.com/lodash.isobject/-/lodash.isobject-3.0.2.tgz#3c8fb8d5b5bf4bf90ae06e14f2a530a4ed935e1d"
@@ -9225,6 +9233,10 @@ lodash.isplainobject@^4.0.6:
   version "4.0.6"
   resolved "https://registry.yarnpkg.com/lodash.isplainobject/-/lodash.isplainobject-4.0.6.tgz#7c526a52d89b45c45cc690b88163be0497f550cb"
 
+lodash.isstring@^4.0.1:
+  version "4.0.1"
+  resolved "https://registry.yarnpkg.com/lodash.isstring/-/lodash.isstring-4.0.1.tgz#d527dfb5456eca7cc9bb95d5daeaf88ba54a5451"
+
 lodash.istypedarray@^3.0.0:
   version "3.0.6"
   resolved "https://registry.yarnpkg.com/lodash.istypedarray/-/lodash.istypedarray-3.0.6.tgz#c9a477498607501d8e8494d283b87c39281cef62"
@@ -9277,6 +9289,10 @@ lodash.sortby@^4.7.0:
   version "4.7.0"
   resolved "https://registry.yarnpkg.com/lodash.sortby/-/lodash.sortby-4.7.0.tgz#edd14c824e2cc9c1e0b0a1b42bb5210516a42438"
 
+lodash.startswith@^4.2.1:
+  version "4.2.1"
+  resolved "https://registry.yarnpkg.com/lodash.startswith/-/lodash.startswith-4.2.1.tgz#c598c4adce188a27e53145731cdc6c0e7177600c"
+
 lodash.tail@^4.1.1:
   version "4.1.1"
   resolved "https://registry.yarnpkg.com/lodash.tail/-/lodash.tail-4.1.1.tgz#d2333a36d9e7717c8ad2f7cacafec7c32b444664"
@@ -10978,13 +10994,14 @@ path@^0.12.7:
     process "^0.11.1"
     util "^0.10.3"
 
-paths.macro@^1.0.1:
-  version "1.0.1"
-  resolved "https://registry.yarnpkg.com/paths.macro/-/paths.macro-1.0.1.tgz#faa4667e5454f5ab9812e9a9af687a683d02330f"
+paths.macro@^2.0.0:
+  version "2.0.0"
+  resolved "https://registry.yarnpkg.com/paths.macro/-/paths.macro-2.0.0.tgz#317b59ab0623d48d1177d9f5e9b4ceaeea563d4a"
   dependencies:
     babel-macros "^1.2.0"
     babel-plugin-macros "^2.0.0"
     find-root "^1.1.0"
+    upath "^1.0.2"
 
 pause-stream@0.0.11:
   version "0.0.11"
@@ -14948,6 +14965,15 @@ unzip-response@^2.0.1:
   version "2.0.1"
   resolved "https://registry.yarnpkg.com/unzip-response/-/unzip-response-2.0.1.tgz#d2f0f737d16b0615e72a6935ed04214572d56f97"
 
+upath@^1.0.2:
+  version "1.0.2"
+  resolved "https://registry.yarnpkg.com/upath/-/upath-1.0.2.tgz#80aaae5395abc5fd402933ae2f58694f0860204c"
+  dependencies:
+    lodash.endswith "^4.2.1"
+    lodash.isfunction "^3.0.8"
+    lodash.isstring "^4.0.1"
+    lodash.startswith "^4.2.1"
+
 update-notifier@^1.0.3:
   version "1.0.3"
   resolved "https://registry.yarnpkg.com/update-notifier/-/update-notifier-1.0.3.tgz#8f92c515482bd6831b7c93013e70f87552c7cf5a"

From 96859ab5d8ee2ddc8199a69f847990923f7cf402 Mon Sep 17 00:00:00 2001
From: Norbert de Langen <ndelangen@me.com>
Date: Fri, 26 Jan 2018 20:36:07 +0100
Subject: [PATCH 13/13] Change to a new version of "paths.macro" that works
 with windows

---
 examples/official-storybook/package.json             |  2 +-
 .../__snapshots__/other-dirname.stories.storyshot    | 12 ------------
 package.json                                         |  1 -
 yarn.lock                                            |  6 +++---
 4 files changed, 4 insertions(+), 17 deletions(-)

diff --git a/examples/official-storybook/package.json b/examples/official-storybook/package.json
index 67d806342a7a..55275de159a6 100644
--- a/examples/official-storybook/package.json
+++ b/examples/official-storybook/package.json
@@ -34,7 +34,7 @@
     "format-json": "^1.0.3",
     "global": "^4.3.2",
     "jest": "^21.2.1",
-    "paths.macro": "^2.0.0",
+    "paths.macro": "^2.0.2",
     "prop-types": "^15.6.0",
     "react": "^16.2.0",
     "react-chromatic": "^0.7.9",
diff --git a/examples/official-storybook/stories/__snapshots__/other-dirname.stories.storyshot b/examples/official-storybook/stories/__snapshots__/other-dirname.stories.storyshot
index 790724334a83..3afa6274d88d 100644
--- a/examples/official-storybook/stories/__snapshots__/other-dirname.stories.storyshot
+++ b/examples/official-storybook/stories/__snapshots__/other-dirname.stories.storyshot
@@ -11,15 +11,3 @@ exports[`Storyshots Other|/stories//Dirname Example story 2 1`] = `
   Story 2
 </button>
 `;
-
-exports[`Storyshots Other|/stories/Dirname Example story 1 1`] = `
-<button>
-  Story 1
-</button>
-`;
-
-exports[`Storyshots Other|/stories/Dirname Example story 2 1`] = `
-<button>
-  Story 2
-</button>
-`;
diff --git a/package.json b/package.json
index 06b2fd24e648..3e742ce16edb 100644
--- a/package.json
+++ b/package.json
@@ -43,7 +43,6 @@
     "babel-polyfill": "^6.26.0",
     "babel-preset-env": "^1.6.1",
     "babel-plugin-macros": "^2.0.0",
-    "paths.macro": "^2.0.0",
     "babel-preset-react": "^6.24.1",
     "babel-preset-stage-0": "^6.24.1",
     "chalk": "^2.3.0",
diff --git a/yarn.lock b/yarn.lock
index 0219070daa81..76a85ae06eb2 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -10994,9 +10994,9 @@ path@^0.12.7:
     process "^0.11.1"
     util "^0.10.3"
 
-paths.macro@^2.0.0:
-  version "2.0.0"
-  resolved "https://registry.yarnpkg.com/paths.macro/-/paths.macro-2.0.0.tgz#317b59ab0623d48d1177d9f5e9b4ceaeea563d4a"
+paths.macro@^2.0.2:
+  version "2.0.2"
+  resolved "https://registry.yarnpkg.com/paths.macro/-/paths.macro-2.0.2.tgz#7b7b3930170c9d41f42ec426c987b2df3505fb72"
   dependencies:
     babel-macros "^1.2.0"
     babel-plugin-macros "^2.0.0"