Fix markdown stories

.storybook/lib/storiesFromMarkdown.js

@@ -19,17 +19,22 @@ const railsOcticonToReact = (html) => {
   return html
 }
 
-const nodeToStory = (node, file) => {
-  const html = railsOcticonToReact(node.value)
-  const element = htmlParser.parse(html)
+const parseBlockAttrs = (node, file) => {
   const pairs = node.lang.replace(/^html\s*/, '')
   const attrs = pairs.length ? parsePairs(pairs) : {}
-  const title = attrs.title || getPreviousHeading(node) ||
-    `story @ ${file}:${node.position.start.line}`
+  attrs.title = attrs.title
+    || getPreviousHeading(node)
+    || `story @ ${file}:${node.position.start.line}`
+  node.block = attrs
+  return node
+}
+
+const nodeToStory = (node, file) => {
+  const html = railsOcticonToReact(node.value)
+  const {title} = node.block
   return {
     title,
-    story: () => element,
-    attrs,
+    story: () => htmlParser.parse(html),
     html,
     file,
     node,
@@ -44,14 +49,17 @@ const getPreviousHeading = node => {
 }
 
 export default req => {
-  return req.keys().reduce((stories, file) => {
-    const content = req(file)
-    const ast = parents(remark.parse(content))
-    const path = file.replace(/^\.\//, '')
-    return stories.concat(
-      select(ast, 'code[lang^=html]')
-        .map(node => nodeToStory(node, path))
-        .filter(({attrs}) => attrs.story !== "false")
-    )
-  }, [])
+  return req.keys()
+    .filter(file => !file.match(/node_modules/))
+    .reduce((stories, file) => {
+      const content = req(file)
+      const ast = parents(remark.parse(content))
+      const path = file.replace(/^\.\//, '')
+      return stories.concat(
+        select(ast, 'code[lang^=html]')
+          .map(parseBlockAttrs)
+          .filter(({block}) => block.story !== "false")
+          .map(node => nodeToStory(node, path))
+      )
+    }, [])
 }

.storybook/webpack.config.js

@@ -1,6 +1,6 @@
-const path = require("path");
+const path = require('path');
 
-const modulesPath = path.resolve(__dirname, "../modules")
+const modulesPath = path.resolve(__dirname, '../modules')
 
 module.exports = (config, env) => {
 
@@ -9,26 +9,34 @@ module.exports = (config, env) => {
       .filter(plugin => plugin.constructor.name !== 'UglifyJsPlugin')
   }
 
-  config.module.rules.push(
-    {
-      test: /\.md$/,
-      use: "raw-loader",
-    },
+  const rules = config.module.rules
+
+  rules.forEach((rule, index) => {
+    if ('README.md'.match(rule.test)) {
+      // console.warn('replacing MD rule:', rule)
+      rules.splice(index, 1, {
+        test: /\.md$/,
+        loader: 'raw-loader',
+      })
+    }
+  })
+
+  rules.push(
     {
       test: /\.scss$/,
       loaders: [
-        "style-loader",
-        "css-loader",
+        'style-loader',
+        'css-loader',
         {
-          loader: "postcss-loader",
+          loader: 'postcss-loader',
           options: {
             config: {
-              path: require.resolve("./postcss.config.js"),
+              path: require.resolve('./postcss.config.js'),
             },
           },
         },
         {
-          loader: "sass-loader",
+          loader: 'sass-loader',
           options: {
             includePaths: [
               modulesPath,