Fix storyshots by moving cacheDirectory to webpack config

app/react/src/server/config/babel.js

@@ -1,9 +1,6 @@
-const findCacheDir = require('find-cache-dir');
-
 module.exports = {
   // Don't try to find .babelrc because we want to force this configuration.
   babelrc: false,
-  cacheDirectory: findCacheDir({ name: 'react-storybook' }),
   presets: [
     [
       require.resolve('babel-preset-env'),

app/vue/src/server/config.js

@@ -1,6 +1,7 @@
 /* eslint-disable global-require, import/no-dynamic-require */
 import fs from 'fs';
 import path from 'path';
+import findCacheDir from 'find-cache-dir';
 import loadBabelConfig from './babel_config';
 
 // avoid ESLint errors
@@ -11,10 +12,16 @@ const logger = console;
 // (inside working directory) if a config path is not provided.
 export default function(configType, baseConfig, configDir) {
   const config = baseConfig;
-
+  
   const babelConfig = loadBabelConfig(configDir);
-  config.module.rules[0].query = babelConfig;
-
+  config.module.rules[0].query = {
+    // 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' }),
+    ...babelConfig,
+  };
+
   // Check whether a config.js file exists inside the storybook
   // config directory and throw an error if it's not.
   const storybookConfigPath = path.resolve(configDir, 'config.js');

app/vue/src/server/config/babel.js

@@ -3,7 +3,6 @@ const findCacheDir = require('find-cache-dir');
 module.exports = {
   // Don't try to find .babelrc because we want to force this configuration.
   babelrc: false,
-  cacheDirectory: findCacheDir({ name: 'react-storybook' }),
   presets: [
     [
       require.resolve('babel-preset-env'),