Same for polymer + fix polymer leftovers

storybookjs · Hypnosphi · Feb 7, 2018 · Feb 7, 2018 · Feb 7, 2018 · Feb 7, 2018
commit 1907caadfe923865bbc38d6b20922dbc57c7409e
diff --git a/app/polymer/package.json b/app/polymer/package.json
@@ -76,12 +76,11 @@
     "serve-favicon": "^2.4.5",
     "shelljs": "^0.8.1",
     "style-loader": "^0.20.1",
+    "uglifyjs-webpack-plugin": "^1.1.7",
     "url-loader": "^0.6.2",
     "util-deprecate": "^1.0.2",
     "uuid": "^3.2.1",
-    "webpack": "^3.6.0",
-    "webpack-dev-middleware": "^1.12.0",
-    "webpack-hot-middleware": "^2.20.0"
+    "webpack": "^3.6.0"
   },
   "devDependencies": {
     "babel-cli": "^6.26.0",

diff --git a/app/polymer/src/server/build.js b/app/polymer/src/server/build.js
@@ -1,93 +1,12 @@
-import '@storybook/core/env';
-
-import webpack from 'webpack';
-import program from 'commander';
+import { buildStatic } from '@storybook/core/server';
 import path from 'path';
-import fs from 'fs';
-import chalk from 'chalk';
-import shelljs from 'shelljs';
-import { logger } from '@storybook/node-logger';
 import packageJson from '../../package.json';
 import getBaseConfig from './config/webpack.config.prod';
 import loadConfig from './config';
-import { parseList, getEnvConfig } from './utils';
-
-process.env.NODE_ENV = process.env.NODE_ENV || 'production';
-
-program
-  .version(packageJson.version)
-  .option('-s, --static-dir <dir-names>', 'Directory where to load static files from', parseList)
-  .option('-o, --output-dir [dir-name]', 'Directory where to store built files')
-  .option('-c, --config-dir [dir-name]', 'Directory where to load Storybook configurations from')
-  .option('-w, --watch', 'Enable watch mode')
-  .option('-d, --db-path [db-file]', 'DEPRECATED!')
-  .option('--enable-db', 'DEPRECATED!')
-  .parse(process.argv);
-
-logger.info(chalk.bold(`${packageJson.name} v${packageJson.version}\n`));
-
-if (program.enableDb || program.dbPath) {
-  logger.error(
-    [
-      'Error: the experimental local database addon is no longer bundled with',
-      'react-storybook. Please remove these flags (-d,--db-path,--enable-db)',
-      'from the command or npm script and try again.',
-    ].join(' ')
-  );
-  process.exit(1);
-}
 
-// The key is the field created in `program` variable for
-// each command line argument. Value is the env variable.
-getEnvConfig(program, {
-  staticDir: 'SBCONFIG_STATIC_DIR',
-  outputDir: 'SBCONFIG_OUTPUT_DIR',
-  configDir: 'SBCONFIG_CONFIG_DIR',
+buildStatic({
+  packageJson,
+  getBaseConfig,
+  loadConfig,
+  defaultFavIcon: path.resolve(__dirname, 'public/favicon.ico'),
 });
-
-const configDir = program.configDir || './.storybook';
-const outputDir = program.outputDir || './storybook-static';
-
-// create output directory if not exists
-shelljs.mkdir('-p', path.resolve(outputDir));
-// clear the static dir
-shelljs.rm('-rf', path.resolve(outputDir, 'static'));
-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);
-config.output.path = path.resolve(outputDir);
-
-// copy all static files
-if (program.staticDir) {
-  program.staticDir.forEach(dir => {
-    if (!fs.existsSync(dir)) {
-      logger.error(`Error: no such directory to load static files: ${dir}`);
-      process.exit(-1);
-    }
-    logger.log(`=> Copying static files from: ${dir}`);
-    shelljs.cp('-r', `${dir}/*`, outputDir);
-  });
-}
-
-// compile all resources with webpack and write them to the disk.
-logger.info('Building storybook ...');
-const webpackCb = (err, stats) => {
-  if (err || stats.hasErrors()) {
-    logger.error('Failed to build the storybook');
-    // eslint-disable-next-line no-unused-expressions
-    err && logger.error(err.message);
-    // eslint-disable-next-line no-unused-expressions
-    stats && stats.hasErrors() && stats.toJson().errors.forEach(e => logger.error(e));
-    process.exitCode = 1;
-  }
-  logger.info('Building storybook completed.');
-};
-const compiler = webpack(config);
-if (program.watch) {
-  compiler.watch({}, webpackCb);
-} else {
-  compiler.run(webpackCb);
-}
diff --git a/app/polymer/src/server/config/utils.js b/app/polymer/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/polymer/src/server/config/webpack.config.js b/app/polymer/src/server/config/webpack.config.js
@@ -8,19 +8,12 @@ import CopyWebpackPlugin from 'copy-webpack-plugin';
 import { managerPath } from '@storybook/core/client';
 
 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: {
@@ -42,7 +35,7 @@ export default function() {
         filename: 'index.html',
         chunks: ['manager'],
         data: {
-          managerHead: getManagerHeadHtml(getConfigDir()),
+          managerHead: getManagerHeadHtml(configDir),
           version,
         },
         template: require.resolve('../index.html.ejs'),
@@ -51,7 +44,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/polymer/src/server/config/webpack.config.prod.js b/app/polymer/src/server/config/webpack.config.prod.js
@@ -1,15 +1,16 @@
 import webpack from 'webpack';
+import UglifyJsPlugin from 'uglifyjs-webpack-plugin';
 import Dotenv from 'dotenv-webpack';
 import InterpolateHtmlPlugin from 'react-dev-utils/InterpolateHtmlPlugin';
 import HtmlWebpackPlugin from 'html-webpack-plugin';
 import CopyWebpackPlugin from 'copy-webpack-plugin';
 import { managerPath } from '@storybook/core/client';
 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'), managerPath],
@@ -34,7 +35,7 @@ export default function() {
         filename: 'index.html',
         chunks: ['manager'],
         data: {
-          managerHead: getManagerHeadHtml(getConfigDir()),
+          managerHead: getManagerHeadHtml(configDir),
           version,
         },
         template: require.resolve('../index.html.ejs'),
@@ -43,7 +44,7 @@ export default function() {
         filename: 'iframe.html',
         excludeChunks: ['manager'],
         data: {
-          previewHead: getPreviewHeadHtml(getConfigDir()),
+          previewHead: getPreviewHeadHtml(configDir),
         },
         template: require.resolve('../iframe.html.ejs'),
       }),
@@ -52,15 +53,18 @@ export default function() {
         { from: require.resolve('@webcomponents/webcomponentsjs/custom-elements-es5-adapter.js') },
       ]),
       new webpack.DefinePlugin(loadEnv({ production: true })),
-      new webpack.optimize.UglifyJsPlugin({
-        compress: {
-          screw_ie8: true,
+      new UglifyJsPlugin({
+        parallel: true,
+        uglifyOptions: {
+          ie8: false,
+          mangle: false,
           warnings: false,
-        },
-        mangle: false,
-        output: {
-          comments: false,
-          screw_ie8: true,
+          compress: {
+            keep_fnames: true,
+          },
+          output: {
+            comments: false,
+          },
         },
       }),
       new Dotenv({ silent: true }),
-Original file line number
+Diff line change
@@ Expand Up / @@ -33,5 +33,3 @@ export function loadEnv(options = {}) { @@
         'process.env': env,
       };
     }
-    export const getConfigDir = () => process.env.SBCONFIG_CONFIG_DIR || './.storybook';