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/lib/error-debug.js

81 lines
1.9 KiB
JavaScript
Raw Normal View History

Don't discard component state on error (#741) * render debug page as overlay * handle errors occurrred on rendering cycle for HMR * retrieve props if required on HMR
2017-01-12 01:58:20 +00:00
import React from 'react'
import ansiHTML from 'ansi-html'
import Head from './head'
Use ErrorDebug component on error of react-hot-loader (#852) * use ErrorDebug component for reporter of react-hot-loader * app: fix props of ErrorDebug
2017-01-21 18:46:18 +00:00
export default ({ error, error: { name, message, module } }) => (
Don't discard component state on error (#741) * render debug page as overlay * handle errors occurrred on rendering cycle for HMR * retrieve props if required on HMR
2017-01-12 01:58:20 +00:00
<div style={styles.errorDebug}>
<Head>
<meta name='viewport' content='width=device-width, initial-scale=1.0' />
</Head>
Update debug error colors (#2182) * Update debug error colors * Soften colors * Color tweaks, use zeit red w white header
2017-06-09 18:50:58 +00:00
{module ? <h1 style={styles.heading}>Error in {module.rawRequest}</h1> : null}
Don't discard component state on error (#741) * render debug page as overlay * handle errors occurrred on rendering cycle for HMR * retrieve props if required on HMR
2017-01-12 01:58:20 +00:00
{
name === 'ModuleBuildError'
Show errored file always in the error overlay. (#1470) This was not happening when there's module not found errors. Now we try to do this for all the errors if possible.
2017-03-22 23:13:23 +00:00
? <pre style={styles.stack} dangerouslySetInnerHTML={{ __html: ansiHTML(encodeHtml(message)) }} />
Use ErrorDebug component on error of react-hot-loader (#852) * use ErrorDebug component for reporter of react-hot-loader * app: fix props of ErrorDebug
2017-01-21 18:46:18 +00:00
: <StackTrace error={error} />
Don't discard component state on error (#741) * render debug page as overlay * handle errors occurrred on rendering cycle for HMR * retrieve props if required on HMR
2017-01-12 01:58:20 +00:00
}
</div>
)
Add cross browser stacktrace (#776) * Add cross browser stacktrace * Remove unused stack variable
2017-01-15 16:17:29 +00:00
const StackTrace = ({ error: { name, message, stack } }) => (
<div>
Show errored file always in the error overlay. (#1470) This was not happening when there's module not found errors. Now we try to do this for all the errors if possible.
2017-03-22 23:13:23 +00:00
<div style={styles.heading}>{message || name}</div>
<pre style={styles.stack}>
Add cross browser stacktrace (#776) * Add cross browser stacktrace * Remove unused stack variable
2017-01-15 16:17:29 +00:00
{stack}
</pre>
</div>
)
Don't discard component state on error (#741) * render debug page as overlay * handle errors occurrred on rendering cycle for HMR * retrieve props if required on HMR
2017-01-12 01:58:20 +00:00
const styles = {
errorDebug: {
Update debug error colors (#2182) * Update debug error colors * Soften colors * Color tweaks, use zeit red w white header
2017-06-09 18:50:58 +00:00
background: '#0e0d0d',
Don't discard component state on error (#741) * render debug page as overlay * handle errors occurrred on rendering cycle for HMR * retrieve props if required on HMR
2017-01-12 01:58:20 +00:00
boxSizing: 'border-box',
overflow: 'auto',
Update debug error colors (#2182) * Update debug error colors * Soften colors * Color tweaks, use zeit red w white header
2017-06-09 18:50:58 +00:00
padding: '24px',
Don't discard component state on error (#741) * render debug page as overlay * handle errors occurrred on rendering cycle for HMR * retrieve props if required on HMR
2017-01-12 01:58:20 +00:00
position: 'fixed',
left: 0,
right: 0,
top: 0,
bottom: 0,
zIndex: 9999
},
Show errored file always in the error overlay. (#1470) This was not happening when there's module not found errors. Now we try to do this for all the errors if possible.
2017-03-22 23:13:23 +00:00
stack: {
Fix error fonts (#826) * add "consolas" font for windows * fix too small font size in non-retina display
2017-01-22 02:04:41 +00:00
fontFamily: '"SF Mono", "Roboto Mono", "Fira Mono", consolas, menlo-regular, monospace',
tweak font sizes again 🙈
2017-01-22 02:12:27 +00:00
fontSize: '13px',
Update debug error colors (#2182) * Update debug error colors * Soften colors * Color tweaks, use zeit red w white header
2017-06-09 18:50:58 +00:00
lineHeight: '18px',
color: '#b3adac',
Don't discard component state on error (#741) * render debug page as overlay * handle errors occurrred on rendering cycle for HMR * retrieve props if required on HMR
2017-01-12 01:58:20 +00:00
margin: 0,
whiteSpace: 'pre-wrap',
Show errored file always in the error overlay. (#1470) This was not happening when there's module not found errors. Now we try to do this for all the errors if possible.
2017-03-22 23:13:23 +00:00
wordWrap: 'break-word',
Update debug error colors (#2182) * Update debug error colors * Soften colors * Color tweaks, use zeit red w white header
2017-06-09 18:50:58 +00:00
marginTop: '16px'
Don't discard component state on error (#741) * render debug page as overlay * handle errors occurrred on rendering cycle for HMR * retrieve props if required on HMR
2017-01-12 01:58:20 +00:00
},
heading: {
Add the system-ui font family (#1555)
2017-03-29 14:55:26 +00:00
fontFamily: '-apple-system, system-ui, BlinkMacSystemFont, Roboto, "Segoe UI", "Fira Sans", Avenir, "Helvetica Neue", "Lucida Grande", sans-serif',
Update debug error colors (#2182) * Update debug error colors * Soften colors * Color tweaks, use zeit red w white header
2017-06-09 18:50:58 +00:00
fontSize: '20px',
fontWeight: '400',
lineHeight: '28px',
color: '#fff',
marginBottom: '0px',
marginTop: '0px'
Don't discard component state on error (#741) * render debug page as overlay * handle errors occurrred on rendering cycle for HMR * retrieve props if required on HMR
2017-01-12 01:58:20 +00:00
}
}
const encodeHtml = str => {
return str.replace(/</g, '&lt;').replace(/>/g, '&gt;')
}
// see color definitions of babel-code-frame:
// https://github.com/babel/babel/blob/master/packages/babel-code-frame/src/index.js
ansiHTML.setColors({
Update debug error colors (#2182) * Update debug error colors * Soften colors * Color tweaks, use zeit red w white header
2017-06-09 18:50:58 +00:00
reset: ['6F6767', '0e0d0d'],
darkgrey: '6F6767',
yellow: '6F6767',
green: 'ebe7e5',
magenta: 'ebe7e5',
blue: 'ebe7e5',
cyan: 'ebe7e5',
red: 'ff001f'
Don't discard component state on error (#741) * render debug page as overlay * handle errors occurrred on rendering cycle for HMR * retrieve props if required on HMR
2017-01-12 01:58:20 +00:00
})
Reference in a new issue Copy permalink