mirror of
https://github.com/terribleplan/next.js.git
synced 2024-01-19 02:48:18 +00:00
408633c1dc
* Remove traces of glamor As talked about with @rauchg. Glamor takes up around 60KB of the bundle (pre-gzip). Since styled-jsx is the way to go now and we support adding glamor by the user we should remove it as dependency cause it is bundled even when not used. Added rehydration to the example, since we did that in our code. There is only one thing I'm not sure about and want to discuss: what should we do with next/css. Right now I added a throw for when it is imported. I'm not sure if we should do that / some other way to notify the user it has been removed. The reasoning behind the throw is that when we would do a console.warn the user would see 'css.default.<X>' not found because we don't have the glamor dependency anymore. * Update yarn.lock * Remove test for styles
86 lines
2.2 KiB
JavaScript
86 lines
2.2 KiB
JavaScript
import { createElement } from 'react'
|
|
import ReactDOM from 'react-dom'
|
|
import { EventEmitter } from 'events'
|
|
import HeadManager from './head-manager'
|
|
import { createRouter } from '../lib/router'
|
|
import App from '../lib/app'
|
|
import evalScript from '../lib/eval-script'
|
|
import { loadGetInitialProps } from '../lib/utils'
|
|
|
|
const {
|
|
__NEXT_DATA__: {
|
|
component,
|
|
errorComponent,
|
|
props,
|
|
err,
|
|
pathname,
|
|
query
|
|
}
|
|
} = window
|
|
|
|
const Component = evalScript(component).default
|
|
const ErrorComponent = evalScript(errorComponent).default
|
|
let lastAppProps
|
|
|
|
export const router = createRouter(pathname, query, {
|
|
Component,
|
|
ErrorComponent,
|
|
err
|
|
})
|
|
|
|
const headManager = new HeadManager()
|
|
const container = document.getElementById('__next')
|
|
|
|
export default (onError) => {
|
|
const emitter = new EventEmitter()
|
|
|
|
router.subscribe(({ Component, props, err }) => {
|
|
render({ Component, props, err, emitter }, onError)
|
|
})
|
|
|
|
render({ Component, props, err, emitter }, onError)
|
|
|
|
return emitter
|
|
}
|
|
|
|
export async function render (props, onError = renderErrorComponent) {
|
|
try {
|
|
await doRender(props)
|
|
} catch (err) {
|
|
await onError(err)
|
|
}
|
|
}
|
|
|
|
async function renderErrorComponent (err) {
|
|
const { pathname, query } = router
|
|
const props = await loadGetInitialProps(ErrorComponent, { err, pathname, query })
|
|
await doRender({ Component: ErrorComponent, props, err })
|
|
}
|
|
|
|
async function doRender ({ Component, props, err, emitter }) {
|
|
if (!props && Component &&
|
|
Component !== ErrorComponent &&
|
|
lastAppProps.Component === ErrorComponent) {
|
|
// fetch props if ErrorComponent was replaced with a page component by HMR
|
|
const { pathname, query } = router
|
|
props = await loadGetInitialProps(Component, { err, pathname, query })
|
|
}
|
|
|
|
if (emitter) {
|
|
emitter.emit('before-reactdom-render', { Component })
|
|
}
|
|
|
|
Component = Component || lastAppProps.Component
|
|
props = props || lastAppProps.props
|
|
|
|
const appProps = { Component, props, err, router, headManager }
|
|
// lastAppProps has to be set before ReactDom.render to account for ReactDom throwing an error.
|
|
lastAppProps = appProps
|
|
|
|
ReactDOM.render(createElement(App, appProps), container)
|
|
|
|
if (emitter) {
|
|
emitter.emit('after-reactdom-render', { Component })
|
|
}
|
|
}
|