[Bug solution] webpack reported an error: Module not found. Did you mean xxx

Bug site:
bug site
Reason:

When modules are imported in .mjs files or other .js files, and their nearest package.json contains a "type" field with a value of "module". When referencing a file, you need to include the extension, otherwise webpack will prompt an error of Module not found and the compilation will fail. (In fact, most of them are dependent on mutual references in node_modules)

Solution:

module.exports = {
    
    
  // ...
  module: {
    
    
    rules: [
      {
    
    
        test: /\.m?js$/,
        resolve: {
    
    
          // 关闭fullySpecified
          fullySpecified: false, // disable the behaviour
        },
      },
    ],
  },
};

If umi is used, modify the configuration through chainWebpack:

export default defineConfig({
    
    
  mfsu: {
    
    },
  webpack5: {
    
    },
  history: {
    
    
    type: 'hash',
  },
    manifest: {
    
    
    basePath: '/',
  },
  ...
  ...
  // 关闭fullySpecified
  chainWebpack: (config) => {
    
    
  	config.module.rule('mjs-rule').test(/.m?js/).resolve.set('fullySpecified', false);
  },
});

Reference documentation
webpack documentation description

Guess you like

Origin blog.csdn.net/haoaiqian/article/details/124434464