CompileErrorTrace.js 1.5 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152
  1. const ansiHTML = require('ansi-html');
  2. const HtmlEntities = require('html-entities');
  3. const theme = require('../theme');
  4. const formatFilename = require('../utils/formatFilename');
  5. ansiHTML.setColors(theme);
  6. const entities = new HtmlEntities.Html5Entities();
  7. /**
  8. * @typedef {Object} CompileErrorTraceProps
  9. * @property {string} errorMessage
  10. */
  11. /**
  12. * A formatter that turns Webpack compile error messages into highlighted HTML source traces.
  13. * @param {Document} document
  14. * @param {HTMLElement} root
  15. * @param {CompileErrorTraceProps} props
  16. * @returns {void}
  17. */
  18. function CompileErrorTrace(document, root, props) {
  19. const errorParts = props.errorMessage.split('\n');
  20. const errorMessage = errorParts
  21. .splice(1, 1)[0]
  22. // Strip filename from the error message
  23. .replace(/^(.*:)\s.*:(\s.*)$/, '$1$2');
  24. errorParts[0] = formatFilename(errorParts[0]);
  25. errorParts.unshift(errorMessage);
  26. const stackContainer = document.createElement('pre');
  27. stackContainer.innerHTML = entities.decode(ansiHTML(entities.encode(errorParts.join('\n'))));
  28. stackContainer.style.fontFamily = [
  29. '"Operator Mono SSm"',
  30. '"Operator Mono"',
  31. '"Fira Code Retina"',
  32. '"Fira Code"',
  33. '"FiraCode-Retina"',
  34. '"Andale Mono"',
  35. '"Lucida Console"',
  36. 'Menlo',
  37. 'Consolas',
  38. 'Monaco',
  39. 'monospace',
  40. ].join(', ');
  41. stackContainer.style.margin = '0';
  42. stackContainer.style.whiteSpace = 'pre-wrap';
  43. root.appendChild(stackContainer);
  44. }
  45. module.exports = CompileErrorTrace;