Make sure hot-self-accept-loader cleans up the route correctly (#4092)

server/build/loaders/hot-self-accept-loader.js

@@ -1,9 +1,11 @@
 import { resolve, relative } from 'path'
+import loaderUtils from 'loader-utils'
 
 module.exports = function (content, sourceMap) {
   this.cacheable()
 
-  const route = getRoute(this)
+  const options = loaderUtils.getOptions(this)
+  const route = getRoute(this, options)
 
   // Webpack has a built in system to prevent default from colliding, giving it a random letter per export.
   // We can safely check if Component is undefined since all other pages imported into the entrypoint don't have __webpack_exports__.default
@@ -30,11 +32,16 @@ module.exports = function (content, sourceMap) {
 
 const nextPagesDir = resolve(__dirname, '..', '..', '..', 'pages')
 
-function getRoute (loaderContext) {
+function getRoute (loaderContext, options) {
   const pagesDir = resolve(loaderContext.options.context, 'pages')
   const { resourcePath } = loaderContext
   const dir = [pagesDir, nextPagesDir]
     .find((d) => resourcePath.indexOf(d) === 0)
-  const path = relative(dir, resourcePath)
+
+  if (!options.extensions) {
+    throw new Error('extensions is not provided to hot-self-accept-loader. Please upgrade all next-plugins to the latest version.')
+  }
+
+  const path = relative(dir, resourcePath).replace(options.extensions, '.js')
   return '/' + path.replace(/((^|\/)index)?\.js$/, '')
 }

server/build/webpack.js

@@ -177,15 +177,18 @@ export default async function getBaseWebpackConfig (dir, {dev = false, isServer
     module: {
       rules: [
         dev && !isServer && {
-          test: /\.(js|jsx)(\?[^?]*)?$/,
+          test: /\.(js|jsx)$/,
           loader: 'hot-self-accept-loader',
           include: [
             path.join(dir, 'pages'),
             nextPagesDir
-          ]
+          ],
+          options: {
+            extensions: /\.(js|jsx)$/
+          }
         },
         {
-          test: /\.+(js|jsx)$/,
+          test: /\.(js|jsx)$/,
           include: [dir],
           exclude: /node_modules/,
           use: defaultLoaders.babel