feat: support assets

Author: satya164

package.json

@@ -1,5 +1,6 @@
 {
   "name": "component-docs",
+  "version": "0.0.0-development",
   "description": "Documentation for React components",
   "scripts": {
     "build": "babel -sd dist/ src/ --copy-files",
@@ -29,6 +30,7 @@
     "dedent": "^0.7.0",
     "express": "^4.16.2",
     "extract-text-webpack-plugin": "^3.0.2",
+    "fs-extra": "^5.0.0",
     "history": "^4.7.2",
     "ignore-styles": "^5.0.1",
     "illuminate-js": "^0.3.0",

src/configureWebpack.js

@@ -80,10 +80,6 @@ export default ({ root, entry, output, production }: Options) => ({
           options: babelrc,
         },
       },
-      {
-        test: /\.(bmp|gif|jpg|jpeg|png|svg|webp|ttf|otf)$/,
-        use: { loader: 'url-loader', options: { limit: 25000 } },
-      },
       {
         test: /\.css$/,
         use: production

src/index.js

@@ -5,7 +5,7 @@ import express from 'express';
 import webpack from 'webpack';
 import devMiddleware from 'webpack-dev-middleware';
 import hotMiddleware from 'webpack-hot-middleware';
-import fs from 'fs';
+import fs from 'fs-extra';
 import path from 'path';
 import watch from 'node-watch';
 import buildEntry from './buildEntry';
@@ -48,6 +48,7 @@ const stringifyData = data => `module.exports = [
 ]`;
 
 export function build({
+  assets,
   pages: getPages,
   output,
   layout = require.resolve('./templates/Layout'),
@@ -61,6 +62,7 @@ export function build({
 
   fs.writeFileSync(path.join(output, 'app.src.js'), buildEntry({ layout }));
   fs.writeFileSync(path.join(output, 'app.data.js'), stringifyData(data));
+  fs.copySync(assets, path.join(output, 'assets'));
 
   buildEntry({ layout });
   buildPageInfo(data).forEach(info => {
@@ -90,6 +92,7 @@ export function build({
 }
 
 export function serve({
+  assets,
   pages: getPages,
   output,
   port = 3031,
@@ -137,6 +140,10 @@ export function serve({
 
   const app = express();
 
+  app.get('/assets/*', (req, res) => {
+    res.sendFile(path.join(assets, req.path.replace(/^\/assets\//, '')));
+  });
+
   app.get('*', (req, res, next) => {
     const page = req.path.slice(1).replace(/\.html$/, '');
 

src/types.js

@@ -10,6 +10,7 @@ export type Page =
 export type Separator = { type: 'separator' };
 
 export type Options = {
+  assets: string,
   pages: Array<Page | Separator> | (() => Array<Page | Separator>),
   output: string,
   port?: number,

yarn.lock

@@ -2683,6 +2683,14 @@ fs-extra@^4.0.2:
     jsonfile "^4.0.0"
     universalify "^0.1.0"
 
+fs-extra@^5.0.0:
+  version "5.0.0"
+  resolved "https://registry.yarnpkg.com/fs-extra/-/fs-extra-5.0.0.tgz#414d0110cdd06705734d055652c5411260c31abd"
+  dependencies:
+    graceful-fs "^4.1.2"
+    jsonfile "^4.0.0"
+    universalify "^0.1.0"
+
 fs-readdir-recursive@^1.0.0:
   version "1.0.0"
   resolved "https://registry.yarnpkg.com/fs-readdir-recursive/-/fs-readdir-recursive-1.0.0.tgz#8cd1745c8b4f8a29c8caec392476921ba195f560"