diff --git a/README.md b/README.md index b802a05..41ff5a3 100644 --- a/README.md +++ b/README.md @@ -370,7 +370,7 @@ See the [example](https://github.com/c8r/x0/tree/master/examples/webpack-config) - [ ] changelog/docs -- [ ] static 404 output +- [x] static 404 output - [x] 404 - [x] Sidebar minHeight/pagination - [x] Sidebar hidePagination option @@ -401,4 +401,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`) (undocumented) +- Remove support for glamor and glamorous diff --git a/lib/build.js b/lib/build.js index ad17376..d58a946 100644 --- a/lib/build.js +++ b/lib/build.js @@ -44,7 +44,6 @@ const getApp = opts => { const STYLED_COMPONENTS_VERSION = '>=3.0' const EMOTION_VERSION = '>=9.0' -const GLAMOR_VERSION = '>=2.0' const getCSSLibrary = opts => { if (opts.cssLibrary) return opts.cssLibrary @@ -63,11 +62,6 @@ const getCSSLibrary = opts => { if (!semver.satisfies(emotionVersion, EMOTION_VERSION)) return null return 'emotion' } - if (deps.glamor) { // || deps.glamorous) { - const glamorVersion = semver.coerce(deps.glamor) - if (!semver.satisfies(glamorVersion, GLAMOR_VERSION)) return null - return 'glamor' - } return null } @@ -88,10 +82,7 @@ const renderHTML = ({ const { ServerStyleSheet } = require('styled-components') const sheet = new ServerStyleSheet() html = render( - sheet.collectStyles( - app - // React.createElement(App.default, { routes, path }) - ) + sheet.collectStyles(app) ) css = sheet.getStyleTags() break @@ -101,15 +92,6 @@ const renderHTML = ({ render(app) ) break - case 'glamor': - // doesn't seem to be working... - const glamor = require('glamor/server') - const res = glamor.renderStatic(() => ( - render(app) - )) - html = res.html - css = `` - break default: html = render(app) break @@ -210,6 +192,22 @@ module.exports = async (opts) => { }) ) }) + // 404 + config.plugins.push( + new MiniHTMLWebpackPlugin({ + filename: '404.html', + template, + context: Object.assign({}, opts, + renderHTML({ + opts, + routes, + App, + props: {}, + path: '/404' + }) + ) + }) + ) const compiler = webpack(config) return new Promise((resolve, reject) => { diff --git a/src/entry.js b/src/entry.js index d148e85..cc62cab 100644 --- a/src/entry.js +++ b/src/entry.js @@ -35,7 +35,6 @@ const getComponents = req => req.keys() module: req(key), Component: req(key).default || req(key), })) - .filter(component => !/404/.test(component.name)) .filter(component => typeof component.Component === 'function') const initialComponents = getComponents(req) @@ -45,8 +44,6 @@ const DefaultApp = props => props.children const Router = IS_CLIENT ? BrowserRouter : StaticRouter const appPath = req.keys().find(key => key === './_app.js') const App = appPath ? (req(appPath).default || req(appPath)) : DefaultApp -const notFoundPath = req.keys().find(key => /404/.test(key)) -const NotFound = notFoundPath ? (req(notFoundPath).default) : FileList export const getRoutes = async (components = initialComponents) => { const promises = await components.map(async ({ @@ -88,11 +85,14 @@ export const getRoutes = async (components = initialComponents) => { } }) const routes = await Promise.all(promises) - const filtered = routes.filter(r => !r.props.ignore) + const filtered = routes + .filter(r => !r.props.ignore) + .filter(component => !/404/.test(component.name)) let sorted = [...filtered] sorted = sortBy([...sorted], a => a.name) sorted = sortBy([...sorted], a => !a.exact) sorted = sortBy([...sorted], a => a.dirname) + sorted.notfound = routes.find(component => /404/.test(component.name)) return sorted } @@ -119,6 +119,10 @@ export default class Root extends React.Component { path = '/' } = this.props + const NotFound = routes.notfound + ? routes.notfound.Component + : FileList + const render = appProps => ( {routes.map(({ Component, ...route }) => (