Use require context for custom apps

README.md

@@ -368,11 +368,11 @@ See the [example](https://github.com/c8r/x0/tree/master/examples/webpack-config)
 
 **REMOVE BEFORE MERGING**
 
-- [ ] require.context `_app`
 - [ ] pass RouterState props to view
 - [ ] props.Component/children in custom apps
 - [ ] Head component with react helmet
 - [ ] changelog/docs
+- [x] require.context `_app`
 - [x] peer deps
 - [x] props.ignore
 - [x] default layout for mdx/md
@@ -389,4 +389,5 @@ See the [example](https://github.com/c8r/x0/tree/master/examples/webpack-config)
 
 - .jsx imports/scope
 - .jsx props
+- custom app path option (must be `_app.js`)
 

cli.js

@@ -110,13 +110,6 @@ if (opts.webpack) {
   if (webpackConfig) opts.webpack = require(webpackConfig)
 }
 
-if (opts.app) {
-  opts.app = path.resolve(opts.app)
-} else {
-  const app = findup.sync('_app.js', { cwd: dirname })
-  if (app) opts.app = app
-}
-
 if (opts.template) {
   opts.template = require(path.resolve(opts.template))
 }

docs/_app.js

@@ -17,7 +17,7 @@ export default class App extends React.Component {
   render () {
     const { routes, route, render } = this.props
 
-    return render()
+    // return render()
 
     return (
       <ScopeProvider scope={scope}>

lib/build.js

@@ -165,7 +165,6 @@ module.exports = async (opts) => {
       DEV: JSON.stringify(false),
       OPTIONS: JSON.stringify(opts),
       DIRNAME: JSON.stringify(opts.dirname),
-      APP: JSON.stringify(opts.app),
       MATCH: JSON.stringify(opts.match)
     })
   )

lib/dev.js

@@ -49,7 +49,6 @@ module.exports = async (opts) => {
       DEV: JSON.stringify(true),
       OPTIONS: JSON.stringify(opts),
       DIRNAME: JSON.stringify(opts.dirname),
-      APP: JSON.stringify(opts.app),
       MATCH: JSON.stringify(opts.match)
     })
   )

src/entry.js

@@ -53,7 +53,8 @@ const DefaultApp = ({ render, routes }) => (
 )
 
 const Router = IS_CLIENT ? BrowserRouter : StaticRouter
-const App = APP ? (require(APP).default || require(APP)) : DefaultApp
+const appPath = req.keys().find(key => key === './_app.js')
+const App = appPath ? (req(appPath).default || req(appPath)) : DefaultApp
 
 export const getRoutes = async (components = initialComponents) => {
   const promises = await components.map(async ({
@@ -166,7 +167,6 @@ export default class Root extends React.Component {
   }
 }
 
-let app
 if (IS_CLIENT) {
   const mount = DEV ? render : hydrate
   const div = window.root || document.body.appendChild(
@@ -174,7 +174,7 @@ if (IS_CLIENT) {
   )
   getRoutes()
     .then(routes => {
-      app = mount(<Root routes={routes} />, div)
+      mount(<Root routes={routes} />, div)
     })
 }