feat: Webpack loader inlining (#21127)

This picks up on the inlining work in #20598 to also include webpack loader inlining optimizations.

This includes:
* The dependencies of sass-loader
* resolve-url-loader

And for added benefit:
* babel-plugin-transform-define
* babel-plugin-transform-react-remove-prop-types

style-loader and css-loader didn't inline easily. Perhaps we can come back to these ones.

packages/next/build/babel/preset.ts

@@ -198,7 +198,7 @@ module.exports = (
       ],
       require('./plugins/amp-attributes'),
       isProduction && [
-        require('babel-plugin-transform-react-remove-prop-types'),
+        require('next/dist/compiled/babel/plugin-transform-react-remove-prop-types'),
         {
           removeImport: true,
         },

packages/next/build/webpack/config/blocks/css/loaders/getCssModuleLocalIdent.ts

@@ -1,4 +1,4 @@
-import loaderUtils from 'loader-utils'
+import loaderUtils from 'next/dist/compiled/loader-utils'
 import path from 'path'
 import { webpack } from 'next/dist/compiled/webpack/webpack'
 

packages/next/build/webpack/loaders/babel-loader/src/index.js

@@ -1,5 +1,5 @@
 // import babel from 'next/dist/compiled/babel/core'
-import loaderUtils from 'loader-utils'
+import loaderUtils from 'next/dist/compiled/loader-utils'
 import { tracer, traceAsyncFn, traceFn } from '../../../../tracer'
 import cache from './cache'
 import transform from './transform'

packages/next/build/webpack/loaders/emit-file-loader.js

@@ -1,4 +1,4 @@
-import loaderUtils from 'loader-utils'
+import loaderUtils from 'next/dist/compiled/loader-utils'
 
 module.exports = function (content, sourceMap) {
   this.cacheable()

packages/next/build/webpack/loaders/error-loader.ts

@@ -1,5 +1,5 @@
 import chalk from 'chalk'
-import loaderUtils from 'loader-utils'
+import loaderUtils from 'next/dist/compiled/loader-utils'
 import path from 'path'
 import { webpack } from 'next/dist/compiled/webpack/webpack'
 

packages/next/build/webpack/loaders/next-babel-loader.js

@@ -155,7 +155,7 @@ const customBabelLoader = babelLoader((babel) => {
       }
 
       options.plugins.push([
-        require.resolve('babel-plugin-transform-define'),
+        require.resolve('next/dist/compiled/babel/plugin-transform-define'),
         {
           'process.env.NODE_ENV': development ? 'development' : 'production',
           'typeof window': isServer ? 'undefined' : 'object',

packages/next/build/webpack/loaders/next-client-pages-loader.ts

@@ -1,4 +1,4 @@
-import loaderUtils from 'loader-utils'
+import loaderUtils from 'next/dist/compiled/loader-utils'
 import { tracer, traceFn } from '../../tracer'
 
 export type ClientPagesLoaderOptions = {

packages/next/build/webpack/plugins/mini-css-extract-plugin/src/loader.js

@@ -1,6 +1,6 @@
 import NativeModule from 'module'
 
-import loaderUtils from 'loader-utils'
+import loaderUtils from 'next/dist/compiled/loader-utils'
 import {
   webpack,
   isWebpack5,

packages/next/bundles/babel/bundle.js

@@ -36,10 +36,18 @@ function pluginSyntaxJsx() {
   return require('@babel/plugin-syntax-jsx')
 }
 
+function pluginTransformDefine() {
+  return require('babel-plugin-transform-define')
+}
+
 function pluginTransformModulesCommonjs() {
   return require('@babel/plugin-transform-modules-commonjs')
 }
 
+function pluginTransformReactRemovePropTypes() {
+  return require('babel-plugin-transform-react-remove-prop-types')
+}
+
 function pluginTransformRuntime() {
   return require('@babel/plugin-transform-runtime')
 }
@@ -66,7 +74,9 @@ module.exports = {
   pluginSyntaxBigint,
   pluginSyntaxDynamicImport,
   pluginSyntaxJsx,
+  pluginTransformDefine,
   pluginTransformModulesCommonjs,
+  pluginTransformReactRemovePropTypes,
   pluginTransformRuntime,
   presetEnv,
   presetReact,

packages/next/bundles/babel/packages/plugin-transform-define.js

@@ -0,0 +1 @@
+module.exports = require('./bundle').pluginTransformDefine()

packages/next/bundles/babel/packages/plugin-transform-react-remove-prop-types.js

@@ -0,0 +1 @@
+module.exports = require('./bundle').pluginTransformReactRemovePropTypes()

packages/next/compiled/babel/plugin-transform-define.js

@@ -0,0 +1 @@
+module.exports = require('./bundle').pluginTransformDefine()

packages/next/compiled/babel/plugin-transform-react-remove-prop-types.js

@@ -0,0 +1 @@
+module.exports = require('./bundle').pluginTransformReactRemovePropTypes()

packages/next/compiled/loader-utils/LICENSE

@@ -0,0 +1,20 @@
+Copyright JS Foundation and other contributors
+
+Permission is hereby granted, free of charge, to any person obtaining
+a copy of this software and associated documentation files (the
+'Software'), to deal in the Software without restriction, including
+without limitation the rights to use, copy, modify, merge, publish,
+distribute, sublicense, and/or sell copies of the Software, and to
+permit persons to whom the Software is furnished to do so, subject to
+the following conditions:
+
+The above copyright notice and this permission notice shall be
+included in all copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED 'AS IS', WITHOUT WARRANTY OF ANY KIND,
+EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT.
+IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY
+CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT,
+TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE
+SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.

packages/next/compiled/loader-utils/package.json

@@ -0,0 +1 @@
+{"name":"loader-utils","main":"index.js","author":"Tobias Koppers @sokra","license":"MIT"}