diff --git a/src/server/babel_config.js b/src/server/babel_config.js new file mode 100644 index 000000000000..2b5f1dbb43f9 --- /dev/null +++ b/src/server/babel_config.js @@ -0,0 +1,70 @@ +/* eslint global-require: 0 */ + +import fs from 'fs'; +import path from 'path'; +import JSON5 from 'json5'; +import defaultConfig from './config/babel.js'; +// avoid ESLint errors +const logger = console; + +function removeReactHmre(presets) { + const index = presets.indexOf('react-hmre'); + if (index > -1) { + presets.splice(index, 1); + } +} + +// Tries to load a .babelrc and returns the parsed object if successful +function loadFromPath(babelConfigPath) { + let config; + if (fs.existsSync(babelConfigPath)) { + const content = fs.readFileSync(babelConfigPath, 'utf-8'); + try { + config = JSON5.parse(content); + config.babelrc = false; + logger.info('=> Loading custom .babelrc'); + } catch (e) { + logger.error(`=> Error parsing .babelrc file: ${e.message}`); + throw e; + } + } + + if (!config) return null; + + // Remove react-hmre preset. + // It causes issues with react-storybook. + // We don't really need it. + // Earlier, we fix this by runnign storybook in the production mode. + // But, that hide some useful debug messages. + if (config.presets) { + removeReactHmre(config.presets); + } + + if (config.env && config.env.development && config.env.development.presets) { + removeReactHmre(config.env.development.presets); + } + + return config; +} + +export default function (configDir) { + let babelConfig = loadFromPath(path.resolve(configDir, '.babelrc')); + let inConfigDir = true; + + if (!babelConfig) { + babelConfig = loadFromPath('.babelrc'); + inConfigDir = false; + } + + if (babelConfig) { + // If the custom config uses babel's `extends` clause, then replace it with + // an absolute path. `extends` will not work unless we do this. + if (babelConfig.extends) { + babelConfig.extends = inConfigDir ? + path.resolve(configDir, babelConfig.extends) : + path.resolve(babelConfig.extends); + } + } + + return babelConfig || defaultConfig; +} diff --git a/src/server/config.js b/src/server/config.js index 20cbcf417d29..5358dfeb256a 100644 --- a/src/server/config.js +++ b/src/server/config.js @@ -2,77 +2,19 @@ import fs from 'fs'; import path from 'path'; -import JSON5 from 'json5'; +import loadBabelConfig from './babel_config'; // avoid ESLint errors const logger = console; -function removeReactHmre(presets) { - const index = presets.indexOf('react-hmre'); - if (index > -1) { - presets.splice(index, 1); - } -} - -// Tries to load a .babelrc and returns the parsed object if successful -function loadBabelConfig(babelConfigPath) { - let config; - if (fs.existsSync(babelConfigPath)) { - const content = fs.readFileSync(babelConfigPath, 'utf-8'); - try { - config = JSON5.parse(content); - config.babelrc = false; - logger.info('=> Loading custom .babelrc'); - } catch (e) { - logger.error(`=> Error parsing .babelrc file: ${e.message}`); - throw e; - } - } - - if (!config) return null; - - // Remove react-hmre preset. - // It causes issues with react-storybook. - // We don't really need it. - // Earlier, we fix this by runnign storybook in the production mode. - // But, that hide some useful debug messages. - if (config.presets) { - removeReactHmre(config.presets); - } - - if (config.env && config.env.development && config.env.development.presets) { - removeReactHmre(config.env.development.presets); - } - - return config; -} - // `baseConfig` is a webpack configuration bundled with storybook. // React Storybook will look in the `configDir` directory // (inside working directory) if a config path is not provided. export default function (configType, baseConfig, configDir) { const config = baseConfig; - // Search for a .babelrc in the config directory, then the module root - // directory. If found, use that to extend webpack configurations. - let babelConfig = loadBabelConfig(path.resolve(configDir, '.babelrc')); - let inConfigDir = true; - - if (!babelConfig) { - babelConfig = loadBabelConfig('.babelrc'); - inConfigDir = false; - } - - if (babelConfig) { - // If the custom config uses babel's `extends` clause, then replace it with - // an absolute path. `extends` will not work unless we do this. - if (babelConfig.extends) { - babelConfig.extends = inConfigDir ? - path.resolve(configDir, babelConfig.extends) : - path.resolve(babelConfig.extends); - } - config.module.loaders[0].query = babelConfig; - } + const babelConfig = loadBabelConfig(configDir); + config.module.loaders[0].query = babelConfig; // Check whether a config.js file exists inside the storybook // config directory and throw an error if it's not.