React: Module not found: Error: Can't resolve...

[OvidijusParsiunas]

This thread is used to troubleshoot an es6 module resolve compilation error that appears to affect some apps when using the react package active-table-react. The error bears some of the following syntax:

Module not found: Error: Can't resolve './utils/outerTableComponents/pagination/paginationInternalUtils' in '/Users/ovidijusparsiunas/Desktop/sample-projects/my-app/node_modules/active-table/dist' Did you mean 'paginationInternalUtils.js'? BREAKING CHANGE: The request './utils/outerTableComponents/pagination/paginationInternalUtils' failed to resolve only because it was resolved as fully specified (probably because the origin is strict EcmaScript Module, e. g. a module with javascript mimetype, a '*.mjs' file, or a '*.js' file where the package.json contains '"type": "module"'). The extension in the request is mandatory for it to be fully specified. Add the extension to the request.

[OvidijusParsiunas]

This issue can be fixed by using one of the following approaches:

1. Changing the react-scripts package version to 4.0.3. Reference.

2. Adding the following to your webpack configuration (References: [1,2,3]):

{
  test: /\.m?js/,
  type: "javascript/auto",
},
{
  test: /\.m?js/,
  resolve: {
    fullySpecified: false,
  },
},

If you are still having this problem or have found an alternative solution, please comment below. If you are experiencing a different problem please create a new issue.