在Strapi自定义插件中导入Content Manager组件遇Webpack错误求助

直接导入@strapi/admin源码目录下的组件会触发Webpack解析错误，原因是这些源码文件未经过预编译，包含JSX或ESNext语法，而默认Webpack配置不会编译node_modules内的此类文件。需要修改插件的Webpack配置来处理这个路径：

1. 在插件根目录创建或修改webpack.config.js
2. 添加如下配置，让Babel loader处理@strapi/admin的源码文件：

const path = require('path');

module.exports = (config) => {
  // 遍历现有规则，找到处理JS/JSX的loader
  config.module.rules.forEach(rule => {
    if (rule.test.toString().includes('jsx|js')) {
      // 将@strapi/admin的源码目录加入编译范围
      rule.include.push(path.resolve(__dirname, '../node_modules/@strapi/admin/admin/src'));
    }
  });

  return config;
};

注意事项 #

• Strapi内部组件属于非公开API，版本更新时可能会发生破坏性变更，尽量优先使用官方暴露的公共组件或API
• 确保插件的Babel配置与Strapi admin的配置兼容，避免语法解析冲突

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