diff --git a/app/angular/src/server/build.js b/app/angular/src/server/build.js
index 74fc769d1a5b..ea488da6a0ee 100755
--- a/app/angular/src/server/build.js
+++ b/app/angular/src/server/build.js
@@ -56,7 +56,7 @@ shelljs.cp(path.resolve(__dirname, 'public/favicon.ico'), outputDir);
 // Build the webpack configuration using the `baseConfig`
 // custom `.babelrc` file and `webpack.config.js` files
 // NOTE changes to env should be done before calling `getBaseConfig`
-const config = loadConfig('PRODUCTION', getBaseConfig(), configDir);
+const config = loadConfig('PRODUCTION', getBaseConfig(configDir), configDir);
 config.output.path = path.resolve(outputDir);
 
 // copy all static files
diff --git a/app/angular/src/server/config/utils.js b/app/angular/src/server/config/utils.js
index 0236481efd78..fc73c38a37f0 100644
--- a/app/angular/src/server/config/utils.js
+++ b/app/angular/src/server/config/utils.js
@@ -33,5 +33,3 @@ export function loadEnv(options = {}) {
     'process.env': env,
   };
 }
-
-export const getConfigDir = () => process.env.SBCONFIG_CONFIG_DIR || './.storybook';
diff --git a/app/angular/src/server/config/webpack.config.js b/app/angular/src/server/config/webpack.config.js
index e479e77efd8b..00a6b4b78bb4 100644
--- a/app/angular/src/server/config/webpack.config.js
+++ b/app/angular/src/server/config/webpack.config.js
@@ -4,19 +4,12 @@ import CaseSensitivePathsPlugin from 'case-sensitive-paths-webpack-plugin';
 import HtmlWebpackPlugin from 'html-webpack-plugin';
 import WatchMissingNodeModulesPlugin from './WatchMissingNodeModulesPlugin';
 
-import {
-  getConfigDir,
-  includePaths,
-  excludePaths,
-  nodeModulesPaths,
-  loadEnv,
-  nodePaths,
-} from './utils';
+import { includePaths, excludePaths, nodeModulesPaths, loadEnv, nodePaths } from './utils';
 import babelLoaderConfig from './babel';
 import { getPreviewHeadHtml, getManagerHeadHtml } from '../utils';
 import { version } from '../../../package.json';
 
-export default function() {
+export default function(configDir) {
   const config = {
     devtool: 'cheap-module-source-map',
     entry: {
@@ -37,7 +30,7 @@ export default function() {
         filename: 'index.html',
         chunks: ['manager'],
         data: {
-          managerHead: getManagerHeadHtml(getConfigDir()),
+          managerHead: getManagerHeadHtml(configDir),
           version,
         },
         template: require.resolve('../index.html.ejs'),
@@ -46,7 +39,7 @@ export default function() {
         filename: 'iframe.html',
         excludeChunks: ['manager'],
         data: {
-          previewHead: getPreviewHeadHtml(getConfigDir()),
+          previewHead: getPreviewHeadHtml(configDir),
         },
         template: require.resolve('../iframe.html.ejs'),
       }),
diff --git a/app/angular/src/server/config/webpack.config.prod.js b/app/angular/src/server/config/webpack.config.prod.js
index c06bc2a4286c..d1b69c809efb 100644
--- a/app/angular/src/server/config/webpack.config.prod.js
+++ b/app/angular/src/server/config/webpack.config.prod.js
@@ -4,11 +4,11 @@ import UglifyJsPlugin from 'uglifyjs-webpack-plugin';
 import HtmlWebpackPlugin from 'html-webpack-plugin';
 
 import babelLoaderConfig from './babel.prod';
-import { getConfigDir, includePaths, excludePaths, loadEnv, nodePaths } from './utils';
+import { includePaths, excludePaths, loadEnv, nodePaths } from './utils';
 import { getPreviewHeadHtml, getManagerHeadHtml } from '../utils';
 import { version } from '../../../package.json';
 
-export default function() {
+export default function(configDir) {
   const entries = {
     preview: [require.resolve('./polyfills'), require.resolve('./globals')],
     manager: [require.resolve('./polyfills'), path.resolve(__dirname, '../../client/manager')],
@@ -32,7 +32,7 @@ export default function() {
         filename: 'index.html',
         chunks: ['manager'],
         data: {
-          managerHead: getManagerHeadHtml(getConfigDir()),
+          managerHead: getManagerHeadHtml(configDir),
           version,
         },
         template: require.resolve('../index.html.ejs'),
@@ -41,7 +41,7 @@ export default function() {
         filename: 'iframe.html',
         excludeChunks: ['manager'],
         data: {
-          previewHead: getPreviewHeadHtml(getConfigDir()),
+          previewHead: getPreviewHeadHtml(configDir),
         },
         template: require.resolve('../iframe.html.ejs'),
       }),
diff --git a/app/angular/src/server/middleware.js b/app/angular/src/server/middleware.js
index 7b84bc34349d..28e8554bccf5 100644
--- a/app/angular/src/server/middleware.js
+++ b/app/angular/src/server/middleware.js
@@ -17,7 +17,7 @@ export const webpackValid = new Promise((resolve, reject) => {
 export default function(configDir) {
   // Build the webpack configuration using the `getBaseConfig`
   // custom `.babelrc` file and `webpack.config.js` files
-  const config = loadConfig('DEVELOPMENT', getBaseConfig(), configDir);
+  const config = loadConfig('DEVELOPMENT', getBaseConfig(configDir), configDir);
   const middlewareFn = getMiddleware(configDir);
 
   // remove the leading '/'
diff --git a/app/react/src/server/build.js b/app/react/src/server/build.js
index 9c6a4689e33a..a6a9635a00df 100755
--- a/app/react/src/server/build.js
+++ b/app/react/src/server/build.js
@@ -54,7 +54,7 @@ shelljs.cp(path.resolve(__dirname, 'public/favicon.ico'), outputDir);
 // Build the webpack configuration using the `baseConfig`
 // custom `.babelrc` file and `webpack.config.js` files
 // NOTE changes to env should be done before calling `getBaseConfig`
-const config = loadConfig('PRODUCTION', getBaseConfig(), configDir);
+const config = loadConfig('PRODUCTION', getBaseConfig(configDir), configDir);
 config.output.path = path.resolve(outputDir);
 
 // copy all static files
diff --git a/app/react/src/server/config/utils.js b/app/react/src/server/config/utils.js
index 0236481efd78..fc73c38a37f0 100644
--- a/app/react/src/server/config/utils.js
+++ b/app/react/src/server/config/utils.js
@@ -33,5 +33,3 @@ export function loadEnv(options = {}) {
     'process.env': env,
   };
 }
-
-export const getConfigDir = () => process.env.SBCONFIG_CONFIG_DIR || './.storybook';
diff --git a/app/react/src/server/config/webpack.config.js b/app/react/src/server/config/webpack.config.js
index c9b354cc120a..49f32d9a82a3 100644
--- a/app/react/src/server/config/webpack.config.js
+++ b/app/react/src/server/config/webpack.config.js
@@ -5,19 +5,12 @@ import CaseSensitivePathsPlugin from 'case-sensitive-paths-webpack-plugin';
 import HtmlWebpackPlugin from 'html-webpack-plugin';
 import WatchMissingNodeModulesPlugin from './WatchMissingNodeModulesPlugin';
 
-import {
-  getConfigDir,
-  includePaths,
-  excludePaths,
-  nodeModulesPaths,
-  loadEnv,
-  nodePaths,
-} from './utils';
+import { includePaths, excludePaths, nodeModulesPaths, loadEnv, nodePaths } from './utils';
 import babelLoaderConfig from './babel';
 import { getPreviewHeadHtml, getManagerHeadHtml } from '../utils';
 import { version } from '../../../package.json';
 
-export default function() {
+export default function(configDir) {
   const config = {
     devtool: 'cheap-module-source-map',
     entry: {
@@ -38,7 +31,7 @@ export default function() {
         filename: 'index.html',
         chunks: ['manager'],
         data: {
-          managerHead: getManagerHeadHtml(getConfigDir()),
+          managerHead: getManagerHeadHtml(configDir),
           version,
         },
         template: require.resolve('../index.html.ejs'),
@@ -47,7 +40,7 @@ export default function() {
         filename: 'iframe.html',
         excludeChunks: ['manager'],
         data: {
-          previewHead: getPreviewHeadHtml(getConfigDir()),
+          previewHead: getPreviewHeadHtml(configDir),
         },
         template: require.resolve('../iframe.html.ejs'),
       }),
diff --git a/app/react/src/server/config/webpack.config.prod.js b/app/react/src/server/config/webpack.config.prod.js
index a651c42b9a34..61b6e0df2df9 100644
--- a/app/react/src/server/config/webpack.config.prod.js
+++ b/app/react/src/server/config/webpack.config.prod.js
@@ -4,11 +4,11 @@ import UglifyJsPlugin from 'uglifyjs-webpack-plugin';
 import HtmlWebpackPlugin from 'html-webpack-plugin';
 
 import babelLoaderConfig from './babel.prod';
-import { getConfigDir, includePaths, excludePaths, loadEnv, nodePaths } from './utils';
+import { includePaths, excludePaths, loadEnv, nodePaths } from './utils';
 import { getPreviewHeadHtml, getManagerHeadHtml } from '../utils';
 import { version } from '../../../package.json';
 
-export default function() {
+export default function(configDir) {
   const entries = {
     preview: [require.resolve('./polyfills'), require.resolve('./globals')],
     manager: [require.resolve('./polyfills'), path.resolve(__dirname, '../../client/manager')],
@@ -32,7 +32,7 @@ export default function() {
         filename: 'index.html',
         chunks: ['manager'],
         data: {
-          managerHead: getManagerHeadHtml(getConfigDir()),
+          managerHead: getManagerHeadHtml(configDir),
           version,
         },
         template: require.resolve('../index.html.ejs'),
@@ -41,7 +41,7 @@ export default function() {
         filename: 'iframe.html',
         excludeChunks: ['manager'],
         data: {
-          previewHead: getPreviewHeadHtml(getConfigDir()),
+          previewHead: getPreviewHeadHtml(configDir),
         },
         template: require.resolve('../iframe.html.ejs'),
       }),
diff --git a/app/react/src/server/middleware.js b/app/react/src/server/middleware.js
index 7b84bc34349d..28e8554bccf5 100644
--- a/app/react/src/server/middleware.js
+++ b/app/react/src/server/middleware.js
@@ -17,7 +17,7 @@ export const webpackValid = new Promise((resolve, reject) => {
 export default function(configDir) {
   // Build the webpack configuration using the `getBaseConfig`
   // custom `.babelrc` file and `webpack.config.js` files
-  const config = loadConfig('DEVELOPMENT', getBaseConfig(), configDir);
+  const config = loadConfig('DEVELOPMENT', getBaseConfig(configDir), configDir);
   const middlewareFn = getMiddleware(configDir);
 
   // remove the leading '/'
diff --git a/app/vue/src/server/build.js b/app/vue/src/server/build.js
index 74fc769d1a5b..ea488da6a0ee 100755
--- a/app/vue/src/server/build.js
+++ b/app/vue/src/server/build.js
@@ -56,7 +56,7 @@ shelljs.cp(path.resolve(__dirname, 'public/favicon.ico'), outputDir);
 // Build the webpack configuration using the `baseConfig`
 // custom `.babelrc` file and `webpack.config.js` files
 // NOTE changes to env should be done before calling `getBaseConfig`
-const config = loadConfig('PRODUCTION', getBaseConfig(), configDir);
+const config = loadConfig('PRODUCTION', getBaseConfig(configDir), configDir);
 config.output.path = path.resolve(outputDir);
 
 // copy all static files
diff --git a/app/vue/src/server/config/utils.js b/app/vue/src/server/config/utils.js
index 0236481efd78..fc73c38a37f0 100644
--- a/app/vue/src/server/config/utils.js
+++ b/app/vue/src/server/config/utils.js
@@ -33,5 +33,3 @@ export function loadEnv(options = {}) {
     'process.env': env,
   };
 }
-
-export const getConfigDir = () => process.env.SBCONFIG_CONFIG_DIR || './.storybook';
diff --git a/app/vue/src/server/config/webpack.config.js b/app/vue/src/server/config/webpack.config.js
index faee281da18c..7b82c774ec91 100644
--- a/app/vue/src/server/config/webpack.config.js
+++ b/app/vue/src/server/config/webpack.config.js
@@ -4,19 +4,12 @@ import Dotenv from 'dotenv-webpack';
 import CaseSensitivePathsPlugin from 'case-sensitive-paths-webpack-plugin';
 import HtmlWebpackPlugin from 'html-webpack-plugin';
 import WatchMissingNodeModulesPlugin from './WatchMissingNodeModulesPlugin';
-import {
-  getConfigDir,
-  includePaths,
-  excludePaths,
-  nodeModulesPaths,
-  loadEnv,
-  nodePaths,
-} from './utils';
+import { includePaths, excludePaths, nodeModulesPaths, loadEnv, nodePaths } from './utils';
 import { getPreviewHeadHtml, getManagerHeadHtml } from '../utils';
 import babelLoaderConfig from './babel';
 import { version } from '../../../package.json';
 
-export default function() {
+export default function(configDir) {
   const config = {
     devtool: 'cheap-module-source-map',
     entry: {
@@ -37,7 +30,7 @@ export default function() {
         filename: 'index.html',
         chunks: ['manager'],
         data: {
-          managerHead: getManagerHeadHtml(getConfigDir()),
+          managerHead: getManagerHeadHtml(configDir),
           version,
         },
         template: require.resolve('../index.html.ejs'),
@@ -46,7 +39,7 @@ export default function() {
         filename: 'iframe.html',
         excludeChunks: ['manager'],
         data: {
-          previewHead: getPreviewHeadHtml(getConfigDir()),
+          previewHead: getPreviewHeadHtml(configDir),
         },
         template: require.resolve('../iframe.html.ejs'),
       }),
diff --git a/app/vue/src/server/config/webpack.config.prod.js b/app/vue/src/server/config/webpack.config.prod.js
index d8e3b93d29ff..070dfcf3b0d4 100644
--- a/app/vue/src/server/config/webpack.config.prod.js
+++ b/app/vue/src/server/config/webpack.config.prod.js
@@ -4,11 +4,11 @@ import UglifyJsPlugin from 'uglifyjs-webpack-plugin';
 import HtmlWebpackPlugin from 'html-webpack-plugin';
 
 import babelLoaderConfig from './babel.prod';
-import { getConfigDir, includePaths, excludePaths, loadEnv, nodePaths } from './utils';
+import { includePaths, excludePaths, loadEnv, nodePaths } from './utils';
 import { getPreviewHeadHtml, getManagerHeadHtml } from '../utils';
 import { version } from '../../../package.json';
 
-export default function() {
+export default function(configDir) {
   const entries = {
     preview: [require.resolve('./polyfills'), require.resolve('./globals')],
     manager: [require.resolve('./polyfills'), path.resolve(__dirname, '../../client/manager')],
@@ -32,7 +32,7 @@ export default function() {
         filename: 'index.html',
         chunks: ['manager'],
         data: {
-          managerHead: getManagerHeadHtml(getConfigDir()),
+          managerHead: getManagerHeadHtml(configDir),
           version,
         },
         template: require.resolve('../index.html.ejs'),
@@ -41,7 +41,7 @@ export default function() {
         filename: 'iframe.html',
         excludeChunks: ['manager'],
         data: {
-          previewHead: getPreviewHeadHtml(getConfigDir()),
+          previewHead: getPreviewHeadHtml(configDir),
         },
         template: require.resolve('../iframe.html.ejs'),
       }),
diff --git a/app/vue/src/server/middleware.js b/app/vue/src/server/middleware.js
index 1dd6fa775b11..3921bf4733f9 100644
--- a/app/vue/src/server/middleware.js
+++ b/app/vue/src/server/middleware.js
@@ -17,7 +17,7 @@ export const webpackValid = new Promise((resolve, reject) => {
 export default function(configDir) {
   // Build the webpack configuration using the `getBaseConfig`
   // custom `.babelrc` file and `webpack.config.js` files
-  const config = loadConfig('DEVELOPMENT', getBaseConfig(), configDir);
+  const config = loadConfig('DEVELOPMENT', getBaseConfig(configDir), configDir);
   const middlewareFn = getMiddleware(configDir);
 
   // remove the leading '/'
diff --git a/examples/official-storybook/addons.js b/examples/official-storybook/addons.js
index 44ceaf69216c..008791934a20 100644
--- a/examples/official-storybook/addons.js
+++ b/examples/official-storybook/addons.js
@@ -1,5 +1,4 @@
 /* eslint-disable import/no-extraneous-dependencies, import/no-unresolved, import/extensions */
-
 import '@storybook/addon-actions/register';
 import '@storybook/addon-links/register';
 import '@storybook/addon-events/register';
@@ -9,3 +8,7 @@ import '@storybook/addon-knobs/register';
 import '@storybook/addon-backgrounds/register';
 import '@storybook/addon-a11y/register';
 import '@storybook/addon-jest/register';
+
+import addHeadWarning from './head-warning';
+
+addHeadWarning('Manager');
diff --git a/examples/official-storybook/config.js b/examples/official-storybook/config.js
index b013ea08ee2c..e0a9c368c68f 100644
--- a/examples/official-storybook/config.js
+++ b/examples/official-storybook/config.js
@@ -2,6 +2,9 @@
 import { configure } from '@storybook/react';
 import { setOptions } from '@storybook/addon-options';
 import 'react-chromatic/storybook-addon';
+import addHeadWarning from './head-warning';
+
+addHeadWarning('Preview');
 
 setOptions({
   hierarchySeparator: /\/|\./,
diff --git a/examples/official-storybook/head-warning.js b/examples/official-storybook/head-warning.js
new file mode 100644
index 000000000000..9e89c5ba3daf
--- /dev/null
+++ b/examples/official-storybook/head-warning.js
@@ -0,0 +1,10 @@
+import { document } from 'global';
+
+export default function addHeadWarning(bundle) {
+  const warning = document.createElement('h1');
+  warning.textContent = `${bundle} head not loaded`;
+  warning.className = `${bundle.toLowerCase()}-head-not-loaded`;
+  warning.style.color = 'red';
+
+  document.body.insertBefore(warning, document.body.firstChild);
+}
diff --git a/examples/official-storybook/manager-head.html b/examples/official-storybook/manager-head.html
new file mode 100644
index 000000000000..5a965218ffe2
--- /dev/null
+++ b/examples/official-storybook/manager-head.html
@@ -0,0 +1,5 @@
+<style>
+    .manager-head-not-loaded {
+        display: none;
+    }
+</style>
diff --git a/examples/official-storybook/preview-head.html b/examples/official-storybook/preview-head.html
new file mode 100644
index 000000000000..ba4ac189b7ff
--- /dev/null
+++ b/examples/official-storybook/preview-head.html
@@ -0,0 +1,5 @@
+<style>
+    .preview-head-not-loaded {
+        display: none;
+    }
+</style>