title: NextJS: TypeError [ERR_INVALID_ARG_TYPE]: The "path" argument must be of type string. Received type boolean (true)
body: <p>I am building a webpage with NextJS. Today I updated NextJS to version 11.0.0, typescript to 4.3.2, and react to 17.0.0.
  Now I am getting this error:</p>
  <pre><code>error - ./pages/_app.tsx
  TypeError [ERR_INVALID_ARG_TYPE]: The &quot;path&quot; argument must be of type string. Received type boolean (true)
  </code></pre>
  <p>I searched Google up and down, but could not find an answer.
  I stripped my custom _app.tsx to the bare minimum:</p>
  <pre><code>import App from 'next/app'; 
  import React from 'react';
      
      export default class MyApp extends App {
      
        public render() {
          const {Component, pageProps} = this.props;
          return (
              &lt;Component {...pageProps} /&gt;
          );   
     } 
  }
  </code></pre>
  <p>but that did not work.</p>
  <p>I also checked my next.config.js but couldn't find anything wrong with it:</p>
  <pre><code>const withImages = require('next-images');
  
  const path = require('path');
  
  const usePolling = process.env.USE_POLLING === 'true';
  
  module.exports = withImages({
    webpack: (config, options) =&gt; {
  
      config.module.rules.push({
        test: /\.(ts|tsx)$/,
        exclude: /\.\.\/node_modules/,
        use: [
          {
            loader: 'next-babel-loader',
            options: {
              ...options.defaultLoaders.babel.options,
              cacheDirectory: true,
              highlightCode: true,
              plugins: [
                ['styled-components', {ssr: true, displayName: true, preprocess: false}],
                ['inline-react-svg', {ignorePattern: 'noinline.svg$', caseSensitive: true, svgo: false}]
              ]
            }
          }
        ]
      });
        config.module.rules.push({
            test: /\.svg$/,
            use: [&quot;@svgr/webpack&quot;]
        });
      config.module.rules.push({
        test: /\.(frag|vert|glsl)$/,
        exclude: /\.\.\/node_modules/,
        use: ['raw-loader', 'glslify-loader']
      });
  
      config.module.rules.push({
        test: /\.css$/,
        use: 'raw-loader'
      });
      return config;
    },
    async headers() {
      return [
        {
          source: '/:all*(svg|jpg|png|js|css)',
          headers: [
            {
              key: 'Cache-Control',
              value: 'public, max-age=31536000, must-revalidate'
            }
          ]
        }
      ];
    },
    webpackDevMiddleware: config =&gt; {
      config.watchOptions = {
        poll: 400,
        aggregateTimeout: 100
      };
      return config;
    }
  });
  </code></pre>
  <p>I am using Node v14.17.0</p>
  <p>I'm slowly losing my mind, did anyone experience the same error?</p>