feat(storybook-config): port over storybook source (#7458)

* feat(storybook-config): port over storybook source * chore: remove comments * chore: run yarn
carbon-design-system · Dec 15, 2020 · 164a006 · 164a006
1 parent c38e0d8
commit 164a006
Show file tree

Hide file tree

Showing 5 changed files with 30 additions and 25 deletions.
diff --git a/config/storybook-preset-carbon/index.js b/config/storybook-preset-carbon/index.js
@@ -9,23 +9,41 @@
 
 module.exports = {
   addons: [
+    '@storybook/addon-storysource',
     '@storybook/addon-knobs',
     '@storybook/addon-actions',
     '@storybook/addon-links',
     '@storybook/addon-docs',
     '@storybook/addon-notes/register',
     'storybook-readme/register',
 
-    // Phase 1: port over add-ons from packages/react/.storybook
     // Phase 2: port over webpack config for Sass
     // Phase 3: port over custom panels/add-ons
   ],
 
-  // We get the current config and we return the new webpack config
   webpack(config) {
     // Configure sass
     // sass-loader
     // css-loader, style-loader, postcss-loader, ...
+    config.module.rules.push({
+      test: /-story\.jsx?$/,
+      loaders: [
+        {
+          loader: require.resolve('@storybook/source-loader'),
+          options: {
+            prettierConfig: {
+              parser: 'babylon',
+              printWidth: 80,
+              tabWidth: 2,
+              bracketSpacing: true,
+              trailingComma: 'es5',
+              singleQuote: true,
+            },
+          },
+        },
+      ],
+      enforce: 'pre',
+    });
 
     return config;
   },

diff --git a/config/storybook-preset-carbon/package.json b/config/storybook-preset-carbon/package.json
@@ -17,6 +17,9 @@
     "components",
     "react"
   ],
+  "peerDependencies": {
+    "@storybook/react": "^5.3.19"
+  },
   "dependencies": {
     "@storybook/addon-actions": "^5.3.19",
     "@storybook/addon-docs": "^5.3.19",
@@ -25,7 +28,10 @@
     "@storybook/addon-notes": "^5.3.19",
     "@storybook/addon-storysource": "^5.3.19",
     "@storybook/addons": "^5.3.19",
-    "@storybook/react": "^5.3.19",
+    "@storybook/source-loader": "^5.3.19",
     "storybook-readme": "^5.0.8"
+  },
+  "devDependencies": {
+    "@storybook/react": "^5.3.19"
   }
 }
diff --git a/packages/react/.storybook/main.js b/packages/react/.storybook/main.js
@@ -9,8 +9,6 @@
 
 module.exports = {
   addons: [
-    '@storybook/addon-storysource',
-
     'storybook-preset-carbon',
     require.resolve('./addon-carbon-theme/register'),
   ],

diff --git a/packages/react/.storybook/webpack.config.js b/packages/react/.storybook/webpack.config.js
@@ -74,26 +74,6 @@ module.exports = ({ config, mode }) => {
     },
   });
 
-  config.module.rules.push({
-    test: /-story\.jsx?$/,
-    loaders: [
-      {
-        loader: require.resolve('@storybook/source-loader'),
-        options: {
-          prettierConfig: {
-            parser: 'babylon',
-            printWidth: 80,
-            tabWidth: 2,
-            bracketSpacing: true,
-            trailingComma: 'es5',
-            singleQuote: true,
-          },
-        },
-      },
-    ],
-    enforce: 'pre',
-  });
-
   const sassLoader = {
     loader: 'sass-loader',
     options: {

diff --git a/yarn.lock b/yarn.lock
@@ -31802,7 +31802,10 @@ resolve@1.1.x:
     "@storybook/addon-storysource": ^5.3.19
     "@storybook/addons": ^5.3.19
     "@storybook/react": ^5.3.19
+    "@storybook/source-loader": ^5.3.19
     storybook-readme: ^5.0.8
+  peerDependencies:
+    "@storybook/react": ^5.3.19
   languageName: unknown
   linkType: soft