Revert "Sourcemap and Breakpoint Fixes (#3121)"

This reverts commit 964f229f98.

server/build/plugins/combine-assets-plugin.js

@@ -1,5 +1,3 @@
-import { ConcatSource } from 'webpack-sources'
-
 // This plugin combines a set of assets into a single asset
 // This should be only used with text assets,
 // otherwise the result is unpredictable.
@@ -10,23 +8,23 @@ export default class CombineAssetsPlugin {
   }
 
   apply (compiler) {
-    compiler.plugin('compilation', (compilation) => {
+    compiler.plugin('after-compile', (compilation, callback) => {
-      compilation.plugin('optimize-chunk-assets', (chunks, callback) => {
+      let newSource = ''
-        const concat = new ConcatSource()
-
       this.input.forEach((name) => {
         const asset = compilation.assets[name]
         if (!asset) return
 
-          concat.add(asset)
+        newSource += `${asset.source()}\n`
 
         // We keep existing assets since that helps when analyzing the bundle
       })
 
-        compilation.assets[this.output] = concat
+      compilation.assets[this.output] = {
+        source: () => newSource,
+        size: () => newSource.length
+      }
 
       callback()
     })
-    })
   }
 }

server/build/plugins/dynamic-chunks-plugin.js

@@ -1,37 +1,39 @@
-import { ConcatSource } from 'webpack-sources'
+export default class PagesPlugin {
-
-export default class DynamicChunksPlugin {
   apply (compiler) {
     const isImportChunk = /^chunks[/\\].*\.js$/
     const matchChunkName = /^chunks[/\\](.*)$/
 
-    compiler.plugin('compilation', (compilation) => {
+    compiler.plugin('after-compile', (compilation, callback) => {
-      compilation.plugin('optimize-chunk-assets', (chunks, callback) => {
+      const chunks = Object
-        chunks = chunks.filter(chunk => isImportChunk.test(chunk.name))
+        .keys(compilation.namedChunks)
+        .map(key => compilation.namedChunks[key])
+        .filter(chunk => isImportChunk.test(chunk.name))
 
       chunks.forEach((chunk) => {
         const asset = compilation.assets[chunk.name]
         if (!asset) return
 
         const chunkName = matchChunkName.exec(chunk.name)[1]
-          const concat = new ConcatSource()
 
-          concat.add(`__NEXT_REGISTER_CHUNK('${chunkName}', function() {
+        const content = asset.source()
-          `)
+        const newContent = `
-          concat.add(asset)
+          window.__NEXT_REGISTER_CHUNK('${chunkName}', function() {
-          concat.add(`
+            ${content}
           })
-          `)
+        `
-
         // Replace the exisiting chunk with the new content
-          compilation.assets[chunk.name] = concat
+        compilation.assets[chunk.name] = {
+          source: () => newContent,
+          size: () => newContent.length
+        }
 
         // This is to support, webpack dynamic import support with HMR
-          compilation.assets[`chunks/${chunk.name}`] = concat
+        compilation.assets[`chunks/${chunk.id}`] = {
+          source: () => newContent,
+          size: () => newContent.length
+        }
       })
-
       callback()
     })
-    })
   }
 }

server/build/plugins/pages-plugin.js

@@ -1,4 +1,3 @@
-import { ConcatSource } from 'webpack-sources'
 import {
   IS_BUNDLED_PAGE,
   MATCH_ROUTE_NAME
@@ -6,11 +5,14 @@ import {
 
 export default class PagesPlugin {
   apply (compiler) {
-    compiler.plugin('compilation', (compilation) => {
+    compiler.plugin('after-compile', (compilation, callback) => {
-      compilation.plugin('optimize-chunk-assets', (chunks, callback) => {
+      const pages = Object
-        const pages = chunks.filter(chunk => IS_BUNDLED_PAGE.test(chunk.name))
+        .keys(compilation.namedChunks)
+        .map(key => compilation.namedChunks[key])
+        .filter(chunk => IS_BUNDLED_PAGE.test(chunk.name))
 
       pages.forEach((chunk) => {
+        const page = compilation.assets[chunk.name]
         const pageName = MATCH_ROUTE_NAME.exec(chunk.name)[1]
         let routeName = pageName
 
@@ -26,28 +28,20 @@ export default class PagesPlugin {
 
         routeName = `/${routeName.replace(/(^|\/)index$/, '')}`
 
-          // Replace the exisiting chunk with the new content
+        const content = page.source()
-          const asset = compilation.assets[chunk.name]
+        const newContent = `
-          if (!asset) return
+          window.__NEXT_REGISTER_PAGE('${routeName}', function() {
-
+            var comp = ${content}
-          const concat = new ConcatSource()
-
-          concat.add(`
-            __NEXT_REGISTER_PAGE('${routeName}', function() {
-              var comp = 
-          `)
-          concat.add(asset)
-          concat.add(`
             return { page: comp.default }
           })
-          `)
+        `
-
         // Replace the exisiting chunk with the new content
-          compilation.assets[chunk.name] = concat
+        compilation.assets[chunk.name] = {
+          source: () => newContent,
+          size: () => newContent.length
+        }
       })
-
       callback()
     })
-    })
   }
 }

server/index.js

@@ -408,11 +408,7 @@ export default class Server {
   }
 
   handleBuildId (buildId, res) {
-    if (this.dev) {
+    if (this.dev) return true
-      res.setHeader('Cache-Control', 'no-store, must-revalidate')
-      return true
-    }
-
     if (buildId !== this.renderOpts.buildId) {
       return false
     }
@@ -432,17 +428,13 @@ export default class Server {
   }
 
   handleBuildHash (filename, hash, res) {
-    if (this.dev) {
+    if (this.dev) return
-      res.setHeader('Cache-Control', 'no-store, must-revalidate')
-      return true
-    }
 
     if (hash !== this.buildStats[filename].hash) {
       throw new Error(`Invalid Build File Hash(${hash}) for chunk: ${filename}`)
     }
 
     res.setHeader('Cache-Control', 'max-age=365000000, immutable')
-    return true
   }
 
   send404 (res) {

server/render.js

@@ -93,6 +93,11 @@ async function doRender (req, res, pathname, query, {
   }
 
   const docProps = await loadGetInitialProps(Document, { ...ctx, renderPage })
+  // While developing, we should not cache any assets.
+  // So, we use a different buildId for each page load.
+  // With that we can ensure, we have unique URL for assets per every page load.
+  // So, it'll prevent issues like this: https://git.io/vHLtb
+  const devBuildId = Date.now()
 
   if (res.finished) return
 
@@ -102,7 +107,7 @@ async function doRender (req, res, pathname, query, {
       props,
       pathname,
       query,
-      buildId,
+      buildId: dev ? devBuildId : buildId,
       buildStats,
       assetPrefix,
       nextExport,