chore: add support for HashRouter using hashRouter config

packages/docz-core/src/Entries.tsx

@@ -30,6 +30,7 @@ const writeAppFiles = async (config: Config, dev: boolean): Promise<void> => {
     theme,
     isProd: !dev,
     wrapper: config.wrapper,
+    hashRouter: config.hashRouter,
     websocketUrl: `ws://${config.websocketHost}:${config.websocketPort}`,
   })
 

packages/docz-core/src/commands/args.ts

@@ -28,7 +28,8 @@ export interface ThemeConfig {
 }
 
 export interface Config extends Argv {
-  plugins?: Plugin[]
+  hashRouter: boolean
+  plugins: Plugin[]
   mdPlugins: any[]
   hastPlugins: any[]
   themeConfig: ThemeConfig

packages/docz-core/src/utils/load-config.ts

@@ -11,6 +11,7 @@ export const loadConfig = (args: Config): Config => {
   const config = load('docz', {
     ...args,
     paths,
+    hashRouter: false,
     plugins: [],
     mdPlugins: [],
     hastPlugins: [],

packages/docz-core/templates/root.tpl.js

@@ -30,15 +30,24 @@ class Root extends React.Component {
 
   render() {
     const { imports } = this.props
-    return <Theme {...this.state} imports={imports} <% if (wrapper) {%>wrapper={Wrapper}<%}%>/>
+
+    return (
+      <Theme
+        {...this.state}
+        imports={imports}
+        hashRouter={<%- hashRouter %>}
+        <% if (wrapper) {%>wrapper={Wrapper}<%}%>
+      />
+    )
   }
 }
 <%} else {%>
 const Root = ({ imports }) => (
   <Theme
-    imports={imports}
     config={config}
     entries={entries}
+    imports={imports}
+    hashRouter={<%- hashRouter %>}
     <% if (wrapper) {%>wrapper={Wrapper}<%}%>
   />
 )

packages/docz/src/theme.tsx

@@ -1,7 +1,7 @@
 import * as React from 'react'
 import { Fragment, SFC } from 'react'
 import { ComponentType as CT } from 'react'
-import { BrowserRouter } from 'react-router-dom'
+import { HashRouter, BrowserRouter } from 'react-router-dom'
 import merge from 'deepmerge'
 
 import { ComponentsMap } from './components/DocPreview'
@@ -59,6 +59,7 @@ const DefaultWrapper: SFC = ({ children }) => <Fragment>{children}</Fragment>
 
 export interface ThemeProps extends DataContext {
   wrapper?: CT
+  hashRouter?: boolean
   children(WrappedComponent: CT): JSX.Element
 }
 
@@ -71,17 +72,19 @@ export function theme(defaultConfig?: ThemeConfig): ThemeReturn {
       entries,
       imports,
       config = {},
+      hashRouter = false,
     }) => {
       const newConfig = merge(defaultConfig, config)
       const value = { entries, imports, config: newConfig }
+      const Router = hashRouter ? HashRouter : BrowserRouter
 
       return (
         <dataContext.Provider value={value}>
-          <BrowserRouter basename={BASE_URL}>
+          <Router basename={BASE_URL}>
             <Wrapper>
               <WrappedComponent />
             </Wrapper>
-          </BrowserRouter>
+          </Router>
         </dataContext.Provider>
       )
     }