From 14abeb0c2f9583772e5ec2134a2c2de97c99e165 Mon Sep 17 00:00:00 2001 From: Stephen Niedzielski Date: Tue, 12 May 2020 10:51:49 -0600 Subject: [PATCH] [dev][Storybook] move to start script; report errors not status Storybook seems to be our primary stackless development workflow. Move the `storybook` script to `start` to support the standard `npm start` command expected in every NPM repo. Debugging Storybook tooling is the rare case that informational messages (perhaps even more verbose than default) are wanted. Feature development is the common workflow that should be optimized for. Storybook's design philosophy seems to favor incredibly verbose output by default, both for the CLI and the [browser console]. This is at odds with Unix's rule of silence, sometimes expressed as "silence is golden." That is, only report warnings and errors unless told otherwise. This patch reduces the verbosity of the Storybook [CLIs] as able and its setup script: - Only report warnings and errors while building. - Suppress build informational output when launching. - Only report curl errors, not progress. [browser console]: https://github.com/storybookjs/storybook/issues/8461 [CLIs]: https://storybook.js.org/docs/configurations/cli-options/ Change-Id: Ie38ae14e304f7f88f445c0c0fb3f2fbba49d134a --- dev-scripts/setup-storybook.sh | 17 ++++++++--------- package.json | 4 ++-- 2 files changed, 10 insertions(+), 11 deletions(-) diff --git a/dev-scripts/setup-storybook.sh b/dev-scripts/setup-storybook.sh index 542301b8e..30db9d580 100755 --- a/dev-scripts/setup-storybook.sh +++ b/dev-scripts/setup-storybook.sh @@ -5,12 +5,11 @@ IFS=$'\n\t' mkdir -p .storybook/resolve-less-imports/mediawiki.ui mkdir -p docs/ui/assets/ -curl "https://en.wikipedia.org/w/load.php?only=styles&skin=vector&debug=true&modules=ext.echo.styles.badge|ext.uls.pt|wikibase.client.init|mediawiki.skinning.interface" -o .storybook/integration.less -curl -L "https://gerrit.wikimedia.org/r/plugins/gitiles/mediawiki/core/+/master/resources/src/mediawiki.less/mediawiki.mixins.less?format=TEXT" | base64 --decode > .storybook/resolve-less-imports/mediawiki.mixins.less -curl -L "https://gerrit.wikimedia.org/r/plugins/gitiles/mediawiki/core/+/master/resources/src/mediawiki.less/mediawiki.ui/variables.less?format=TEXT" | base64 --decode > .storybook/resolve-less-imports/mediawiki.ui/variables.less -curl -L "https://gerrit.wikimedia.org/r/plugins/gitiles/mediawiki/core/+/master/resources/src/mediawiki.less/mediawiki.mixins.rotation.less?format=TEXT" | base64 --decode > .storybook/resolve-less-imports/mediawiki.mixins.rotation.less -curl -L "https://gerrit.wikimedia.org/r/plugins/gitiles/mediawiki/core/+/master/resources/src/mediawiki.less/mediawiki.mixins.animation.less?format=TEXT" | base64 --decode > .storybook/resolve-less-imports/mediawiki.mixins.animation.less -curl "https://en.m.wikipedia.org/static/images/mobile/copyright/wikipedia-wordmark-en.svg" -o "docs/ui/assets/wordmark.svg" -curl "https://en.m.wikipedia.org/static/images/mobile/copyright/wikipedia.png" -o "docs/ui/assets/icon.png" -# FIXME: Update to en.wikipedia.org uris when available. -curl "https://di-logo-sandbox.firebaseapp.com/img/tagline/en-tagline-117-13.svg" -o "docs/ui/assets/tagline.svg" +curl -sS "https://en.wikipedia.org/w/load.php?only=styles&skin=vector&debug=true&modules=ext.echo.styles.badge|ext.uls.pt|wikibase.client.init|mediawiki.skinning.interface" -o .storybook/integration.less +curl -sSL "https://gerrit.wikimedia.org/r/plugins/gitiles/mediawiki/core/+/master/resources/src/mediawiki.less/mediawiki.mixins.less?format=TEXT" | base64 --decode > .storybook/resolve-less-imports/mediawiki.mixins.less +curl -sSL "https://gerrit.wikimedia.org/r/plugins/gitiles/mediawiki/core/+/master/resources/src/mediawiki.less/mediawiki.ui/variables.less?format=TEXT" | base64 --decode > .storybook/resolve-less-imports/mediawiki.ui/variables.less +curl -sSL "https://gerrit.wikimedia.org/r/plugins/gitiles/mediawiki/core/+/master/resources/src/mediawiki.less/mediawiki.mixins.rotation.less?format=TEXT" | base64 --decode > .storybook/resolve-less-imports/mediawiki.mixins.rotation.less +curl -sSL "https://gerrit.wikimedia.org/r/plugins/gitiles/mediawiki/core/+/master/resources/src/mediawiki.less/mediawiki.mixins.animation.less?format=TEXT" | base64 --decode > .storybook/resolve-less-imports/mediawiki.mixins.animation.less +curl -sS "https://en.m.wikipedia.org/static/images/mobile/copyright/wikipedia-wordmark-en.svg" -o "docs/ui/assets/wordmark.svg" +curl -sS "https://en.m.wikipedia.org/static/images/mobile/copyright/wikipedia.png" -o "docs/ui/assets/icon.png" +curl -sS "https://en.wikipedia.org/static/images/mobile/copyright/wikipedia-tagline-en.svg" -o "docs/ui/assets/tagline.svg" diff --git a/package.json b/package.json index f296d8190..84f9b5fdf 100644 --- a/package.json +++ b/package.json @@ -1,6 +1,7 @@ { "private": true, "scripts": { + "start": "dev-scripts/setup-storybook.sh && start-storybook --quiet -p 6006 -s docs/ui", "build": "npm -s test && npm -s run doc", "test": "npm -s run lint && tsc", "lint": "npm -s run lint:js && npm -s run lint:styles && npm -s run lint:i18n", @@ -10,8 +11,7 @@ "lint:styles": "stylelint \"**/*.{less,css}\"", "lint:i18n": "banana-checker --requireLowerCase=0 i18n/", "doc": "jsdoc -c jsdoc.json && npm run build-storybook", - "storybook": "bash ./dev-scripts/setup-storybook.sh && start-storybook -p 6006 -s docs/ui/", - "build-storybook": "bash ./dev-scripts/setup-storybook.sh && build-storybook -o docs/ui", + "build-storybook": "dev-scripts/setup-storybook.sh && build-storybook --quiet --loglevel warn -o docs/ui", "svgmin": "svgo --config=.svgo.yml -q -r -f resources/" }, "devDependencies": {