@kaliber/build 0.0.123 → 0.0.124

package/lib/eval-in-fork.js

@@ -1,22 +1,22 @@
-attempt(() => {
-  const { evalWithSourceMap, withSourceMappedError } = require('./node-utils')
+const fs = require('fs-extra')
+const path = require('path')
+const uuid = require('uuid')
 
-  const messages = []
+attempt(() => {
   process.on('message', handleMessage)
-  function handleMessage(x) {
+
+  function handleMessage(source) {
     attempt(() => {
-      messages.push(x)
-      const [source, map] = messages
-      if (source !== undefined && map !== undefined) {
-        process.off('message', handleMessage)
-        const createMap = () => map
-        const { template, renderer } = evalWithSourceMap(source, createMap)
-        const result = withSourceMappedError(createMap, () => renderer(template))
-        process.send(result, e => attempt(() => {
+      process.off('message', handleMessage)
+      const { template, renderer } = evalSource(source)
+      const result = renderer(template)
+
+      process.send(result, e =>
+        attempt(() => {
           if (e) throw e
           else process.exit()
-        }))
-      }
+        })
+      )
     })
   }
 })
@@ -29,3 +29,9 @@ function attempt(f) {
     process.exit(1)
   }
 }
+
+function evalSource(source) {
+  const file = path.resolve(`.kaliber-eval`, `${uuid.v4()}.js`)
+  fs.outputFileSync(file, source, { encoding: 'utf-8' })
+  try { return require(file) } finally { fs.removeSync(file) }
+}

package/lib/node-utils.js

@@ -1,35 +1,11 @@
-const { SourceMapConsumer } = require('source-map')
 const path = require('path')
 const childProcess = require('child_process')
 
 module.exports = {
-  evalWithSourceMap,
-  withSourceMappedError,
   evalInFork,
 }
 
-function evalWithSourceMap(source, createMap) {
-  return withSourceMappedError(createMap, () => {
-    const module = { exports: {} }
-    eval(source) // eslint-disable-line no-eval
-    return module.exports.default || module.exports
-  }, { evalOnly: true })
-}
-
-function withSourceMappedError(createMap, fn, options) {
-  return withRawErrorStack(() => {
-    try {
-      return fn()
-    } catch (e) {
-      const messageWithStack = e + '\n' + toMappedStack(createMap, e.stack, options)
-      const error = new Error(messageWithStack)
-      error.stack = messageWithStack
-      throw error
-    }
-  })
-}
-
-async function evalInFork(source, map) {
+async function evalInFork(name, source, map) {
   return new Promise((resolve, reject) => {
     const js = childProcess.fork(
       path.join(__dirname, 'eval-in-fork.js'),
@@ -49,33 +25,15 @@ async function evalInFork(source, map) {
         else resolve(messageData.join(''))
       } else reject(new Error(errData.join('')))
     })
-    js.send(source)
-    js.send(map)
-  })
-}
-
 
-function withRawErrorStack(fn) {
-  const $prepareStackTrace = Error.prepareStackTrace
-  Error.prepareStackTrace = (error, stack) => stack
-  try { return fn() } finally { Error.prepareStackTrace = $prepareStackTrace }
+    js.send(appendSourceMap(name, source, map))
+  })
 }
 
-function toMappedStack(createMap, stack = [], { evalOnly = false } = {}) {
-  const sourceMap = new SourceMapConsumer(createMap())
-  return stack
-    .map(frame => {
-      if (evalOnly && !frame.isEval()) return null
+function appendSourceMap(name, source, map) {
+  map.sources = map.sources.map(source => { try { return require.resolve(source) } catch (_) { return `/.../${source}` } })
 
-      const [frameLine, frameColumn] = [frame.getLineNumber(), frame.getColumnNumber()]
-      if (!frameLine || !frameColumn) return `    at ${frame.getFileName()}:${frameLine}:${frameColumn}`
-
-      const generated = { line: frameLine, column: frameColumn - 1 }
-      const { source, line, column } = sourceMap.originalPositionFor(generated)
-      return (source && !source.startsWith('webpack/'))
-        ? `    at ${source}:${line}:${column + 1}`
-        : null
-    })
-    .filter(Boolean)
-    .join('\n')
+  const base64Map = Buffer.from(JSON.stringify(map), 'utf-8').toString('base64')
+  const sourceMap = `//# sourceMappingURL=data:application/json;charset=utf-8;base64,${base64Map}`
+  return `${source}\n${sourceMap}\n//# sourceURL=${name}`
 }

package/lib/serve.js

@@ -59,14 +59,14 @@ app.use((err, req, res, next) => {
   if (!err) return next()
 
   console.error(err)
-  if (reportError) reportError(err)
+  if (reportError) reportError(err, req)
 
   const response = res.status(500)
   if (isProduction) {
     findFile(req.path, internalServerError)
       .then(file => file ? response.sendFile(file) : next())
       .catch(next)
-  } else response.send(`<pre>${err.toString()}</pre>`)
+  } else response.send(`<pre><title style='display: block;'>${err.stack || err.toString()}</title><pre>`)
 })
 
 app.listen(port, () => console.log(`Server listening at port ${port}`))

package/package.json

@@ -1,5 +1,5 @@
 {
-  "version": "0.0.123",
+  "version": "0.0.124",
   "name": "@kaliber/build",
   "description": "Zero configuration, opinionated webpack / react build setup",
   "scripts": {
@@ -80,13 +80,13 @@
     "react": "^17.0.2",
     "react-dom": "^17.0.2",
     "rollbar": "^2.19.3",
-    "source-map": "0.6.1",
     "stylelint": "^13.7.1",
     "stylelint-use-nesting": "^3.0.0",
     "tapable": "^2.0.0",
     "terser-webpack-plugin": "^4.2.2",
     "time-fix-plugin": "^2.0.7",
     "url-loader": "^4.1.0",
+    "uuid": "^8.3.2",
     "walk-sync": "^3.0.0",
     "webpack": "^4.44.2",
     "webpack-node-externals": "^2.5.2",

package/webpack-plugins/source-map-plugin.js

@@ -31,7 +31,7 @@ module.exports = function sourceMapPlugin({ sourceRoot }) {
 
               const [startComment, endComment] = name.endsWith('.css') ? ['/*', ' */'] : ['//', '']
               assets[name] = new ConcatSource(asset, `\n${startComment}# sourceMappingURL=${path.basename(name)}.map${endComment}\n`)
-              assets[name + '.map'] = new RawSource(JSON.stringify(map))
+              assets[name + '.map'] = new RawSource(JSON.stringify({ ...map, sourceRoot: `${sourceRoot}/` }))
             }
           })
         })

package/webpack-plugins/template-plugin.js

@@ -143,11 +143,11 @@ module.exports = function templatePlugin(renderers) {
                 try {
                   const files = isFunction
                     ? [
-                      [srcExt, createDynamicTemplate(path.basename(outputName), templateExt, map)],
-                      [templateExt, new RawSource(source)]
+                      [srcExt, createDynamicTemplate(path.basename(outputName), templateExt)],
+                      [templateExt, asset]
                     ]
                     : [
-                      [targetExt, await createStaticTemplate(source, map)]
+                      [targetExt, await createStaticTemplate(name, source, map)]
                     ]
 
                   files.forEach(([ext, result]) => {
@@ -169,26 +169,22 @@ module.exports = function templatePlugin(renderers) {
   }
 }
 
-async function createStaticTemplate(source, map) {
-  return new RawSource(await evalInFork(source, map))
+async function createStaticTemplate(name, source, map) {
+  return new RawSource(await evalInFork(name, source, map))
 }
 
-function createDynamicTemplate(name, ext, map) {
+function createDynamicTemplate(name, ext) {
   return new RawSource(
-    `|const createMap = () => JSON.parse(${JSON.stringify((JSON.stringify(map)))})
-     |
-     |const { withSourceMappedError } = require('@kaliber/build/lib/node-utils')
-     |
-     |const envRequire = process.env.NODE_ENV === 'production' ? require : require('import-fresh')
-     |const { template, renderer } = withSourceMappedError(createMap, () => envRequire('./${name}${ext}'))
+    `|const envRequire = process.env.NODE_ENV === 'production' ? require : require('import-fresh')
+     |const { template, renderer } = envRequire('./${name}${ext}')
      |
      |Object.assign(render, template)
      |
      |module.exports = render
      |
      |function render(props) {
-     |  return withSourceMappedError(createMap, () => renderer(template(props)))
+     |  return renderer(template(props))
      |}
-     |`.split(/^[ \t]*\|/m).join('')
+     |`.replace(/^[ \t]*\|/gm, '')
   )
 }