Webpack 5中entry用函数赋值触发配置错误求助

你犯了Webpack配置的常见误区：entry对象的属性值不能是函数，只有整个entry字段本身可以是函数。你当前把函数赋值给entry['mma']的写法，不符合Webpack的Schema校验规则，这就是报错的核心原因。

把整个entry改成函数，让函数返回包含mma入口的配置对象，Webpack就能正确识别函数生成的入口内容了。

同步写法修改 #

const fs = require('fs');
const path = require('path'); // 用path模块处理路径，避免系统分隔符问题

module.exports = {
  // ...其他配置项
  entry: function() {
    // 替代split/filter逻辑，用path模块更简洁可靠地定位dist目录
    const distDir = path.resolve(__dirname, '..', 'dist');
    return {
      'mma': fs.readdirSync(distDir)
        .sort((a) => {
          if (a.startsWith('v')) return -1;
          if (a.startsWith('c')) return 1;
          return 0;
        })
        .filter(file => file.endsWith('.js')) // 建议过滤非JS文件，避免无效资源引入
        .map(file => path.join('./dist', file))
    };
  },
  // ...其他配置项
};

异步写法修改 #

Webpack 5支持异步函数作为entry，直接返回Promise即可：

const fs = require('fs/promises');
const path = require('path');

module.exports = {
  // ...其他配置项
  entry: async function() {
    const distDir = path.resolve(__dirname, '..', 'dist');
    const filePaths = await fs.readdir(distDir);
    return {
      'mma': filePaths
        .sort((a) => {
          if (a.startsWith('v')) return -1;
          if (a.startsWith('c')) return 1;
          return 0;
        })
        .filter(file => file.endsWith('.js'))
        .map(file => path.join('./dist', file))
    };
  },
  // ...其他配置项
};

• 始终用path模块处理路径，避免Windows与Linux系统分隔符差异导致的错误
• 建议过滤dist目录中的非JS文件，防止Webpack尝试打包无效资源
• 确保dist目录在Webpack执行时已存在，否则会触发读取失败，可添加判断：

  if (!fs.existsSync(distDir)) {
    throw new Error('dist目录不存在，请先执行前置构建流程');
  }
  

内容的提问来源于stack exchange，提问作者ar_IGT