terribleplan/next.js
1
0
Fork 0
mirror of https://github.com/terribleplan/next.js.git synced 2024-01-19 02:48:18 +00:00
Code Issues Releases Wiki Activity
next.js/server/document.js

110 lines
2.6 KiB
JavaScript
Raw Normal View History

upgrade react to v15.5 and use prop-types instead of React.PropTypes (#1684) * upgrade react to v15.5 and use prop-types instead of React.PropTypes * Update package.json
2017-04-10 18:35:26 +00:00
import React, { Component } from 'react'
import PropTypes from 'prop-types'
custom document support (#405)
2016-12-16 18:42:40 +00:00
import htmlescape from 'htmlescape'
Incorporate styled-jsx (#420) * integrate styled-jsx * define styles of pages with styled-jsx * bump styled-jsx * bump styled-jsx * error-debug: fix style * bump styled-jsx * fix examples to use styled-jsx * bump styled-jsx
2016-12-19 18:42:19 +00:00
import flush from 'styled-jsx/server'
custom document support (#405)
2016-12-16 18:42:40 +00:00
export default class Document extends Component {
static getInitialProps ({ renderPage }) {
Introduce better debug error handling (#1592) * Introduce better debug error handling With this we are rendering runtime and debug errors inside a it's own error root. That gives us better error handling and control. Also, now we are patching React core to capture runtime errors. * Render the initial error on the server.
2017-04-01 21:03:40 +00:00
const { html, head, errorHtml } = renderPage()
Remove traces of glamor (#1286) * 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
2017-02-26 12:28:00 +00:00
const styles = flush()
Introduce better debug error handling (#1592) * Introduce better debug error handling With this we are rendering runtime and debug errors inside a it's own error root. That gives us better error handling and control. Also, now we are patching React core to capture runtime errors. * Render the initial error on the server.
2017-04-01 21:03:40 +00:00
return { html, head, errorHtml, styles }
custom document support (#405)
2016-12-16 18:42:40 +00:00
}
static childContextTypes = {
_documentProps: PropTypes.any
}
getChildContext () {
return { _documentProps: this.props }
}
render () {
return <html>
<Head />
<body>
<Main />
<NextScript />
</body>
</html>
}
}
export class Head extends Component {
static contextTypes = {
_documentProps: PropTypes.any
}
render () {
Remove traces of glamor (#1286) * 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
2017-02-26 12:28:00 +00:00
const { head, styles } = this.context._documentProps
custom document support (#405)
2016-12-16 18:42:40 +00:00
return <head>
{(head || []).map((h, i) => React.cloneElement(h, { key: i }))}
Remove traces of glamor (#1286) * 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
2017-02-26 12:28:00 +00:00
{styles || null}
custom document support (#405)
2016-12-16 18:42:40 +00:00
{this.props.children}
</head>
}
}
export class Main extends Component {
static contextTypes = {
_documentProps: PropTypes.any
}
render () {
Introduce better debug error handling (#1592) * Introduce better debug error handling With this we are rendering runtime and debug errors inside a it's own error root. That gives us better error handling and control. Also, now we are patching React core to capture runtime errors. * Render the initial error on the server.
2017-04-01 21:03:40 +00:00
const { html, errorHtml } = this.context._documentProps
return (
<div>
<div id='__next' dangerouslySetInnerHTML={{ __html: html }} />
<div id='__next-error' dangerouslySetInnerHTML={{ __html: errorHtml }} />
</div>
)
custom document support (#405)
2016-12-16 18:42:40 +00:00
}
}
export class NextScript extends Component {
static contextTypes = {
_documentProps: PropTypes.any
}
Load the main JS bundle in production with async (#1485) * Use a webpack plugin to combine assets. * Add comments and make this releseable. * Fix some typos. * Fix some typos.
2017-03-24 07:51:34 +00:00
getChunkScript (filename, additionalProps = {}) {
Add content based HASH to main.js and common.js (#1336) * Use file hashes instead of BUILD_ID. Now JSON pages also not prefixed with a hash and doesn't support immutable caching. Instead it supports Etag bases caching. * Remove appUpdated Router Events hook. Becuase now we don't need it because there's no buildId validation. * Remove buildId generation. * Turn off hash checks in the dev mode. * Update tests. * Revert "Remove buildId generation." This reverts commit fdd36a5a0a307becdbd1d85ae3881b3a15b03d26. * Bring back the buildId validation. * Handle buildId validation only in production. * Add BUILD_ID to path again. * Remove duplicate immutable header. * Fix tests.
2017-03-07 18:43:56 +00:00
const { __NEXT_DATA__ } = this.context._documentProps
let { buildStats } = __NEXT_DATA__
const hash = buildStats ? buildStats[filename].hash : '-'
return (
Load the main JS bundle in production with async (#1485) * Use a webpack plugin to combine assets. * Add comments and make this releseable. * Fix some typos. * Fix some typos.
2017-03-24 07:51:34 +00:00
<script
type='text/javascript'
src={`/_next/${hash}/${filename}`}
{...additionalProps}
/>
Add content based HASH to main.js and common.js (#1336) * Use file hashes instead of BUILD_ID. Now JSON pages also not prefixed with a hash and doesn't support immutable caching. Instead it supports Etag bases caching. * Remove appUpdated Router Events hook. Becuase now we don't need it because there's no buildId validation. * Remove buildId generation. * Turn off hash checks in the dev mode. * Update tests. * Revert "Remove buildId generation." This reverts commit fdd36a5a0a307becdbd1d85ae3881b3a15b03d26. * Bring back the buildId validation. * Handle buildId validation only in production. * Add BUILD_ID to path again. * Remove duplicate immutable header. * Fix tests.
2017-03-07 18:43:56 +00:00
)
}
Load the main JS bundle in production with async (#1485) * Use a webpack plugin to combine assets. * Add comments and make this releseable. * Fix some typos. * Fix some typos.
2017-03-24 07:51:34 +00:00
getScripts () {
const { dev } = this.context._documentProps
if (dev) {
return (
<div>
Move all NPM modules into a single chunk in dev mode. (#1512) This will isolate all the NPM modules into a single chunk. That chunk won't touch by webpack unless, there's a new NPM module. That gives us much better re-build performance.
2017-03-26 20:48:59 +00:00
{ this.getChunkScript('manifest.js') }
Load the main JS bundle in production with async (#1485) * Use a webpack plugin to combine assets. * Add comments and make this releseable. * Fix some typos. * Fix some typos.
2017-03-24 07:51:34 +00:00
{ this.getChunkScript('commons.js') }
{ this.getChunkScript('main.js') }
</div>
)
}
// In the production mode, we have a single asset with all the JS content.
// So, we can load the script with async
return this.getChunkScript('app.js', { async: true })
}
custom document support (#405)
2016-12-16 18:42:40 +00:00
render () {
Implement "Immutable build artifacts" feature (#745) * Write BUILD_ID when building. It's a random id (uuid.v4()) * Add buildId to the core JS files. * Add immutable cache-control header. Only if the buildId is matched. * Set '-' as the dev buildId always. * Add buildId handling for JSON pages.
2017-01-11 20:16:18 +00:00
const { staticMarkup, __NEXT_DATA__ } = this.context._documentProps
Bundle all the modules inside the app (#414) * Remove the use of CDN and bundle everything inside the app. We still pre-build the prefetcher because it needs different webpack config which only targets browsers supports Service Workers. * Remove cdn config item. We no longer using it. * Stop adding script tags when staticMarkup=true * Remove babel-plugin-transform-remove-strict-mode NPM module.
2016-12-17 08:49:10 +00:00
custom document support (#405)
2016-12-16 18:42:40 +00:00
return <div>
Move nextdata into nextScript and make Main return a single el (#831)
2017-01-20 00:14:05 +00:00
{staticMarkup ? null : <script dangerouslySetInnerHTML={{
__html: `__NEXT_DATA__ = ${htmlescape(__NEXT_DATA__)}; module={};`
}} />}
Load the main JS bundle in production with async (#1485) * Use a webpack plugin to combine assets. * Add comments and make this releseable. * Fix some typos. * Fix some typos.
2017-03-24 07:51:34 +00:00
{staticMarkup ? null : this.getScripts()}
custom document support (#405)
2016-12-16 18:42:40 +00:00
</div>
}
}
Reference in a new issue Copy permalink