reactjs：升级webpack后导入模板自定义元素失败

编程问答 2022-08-16

问题描述

在我们的ReactJS应用程序中，我们使用了一些我们已经构建的模具自定义元素包，到目前为止，一切都可以正常工作。将webpack版本升级到4后，我们将无法导入加载程序默认的mjs文件。

这是我们在文档中编写时如何导入defineCustomElements的方法：

import { defineCustomElements }  from 'custom-component/loader';

这会导致错误：

Uncaught (in promise) TypeError: Object(...) is not a function

表示defineCustomElements未定义。

如果我们复制loader文件夹中的index.mjs文件，将其命名为index.js并直接将其导入：

import { defineCustomElements }  from 'custom-component/loader/index.js';

然后一切正常。但这不是一个好的解决方法，因为每次我们更新外部自定义元素包时，我们都需要这样做。

在我们的webpack.config.js文件中，我们具有：

resolve: {
    modules: [
      'node_modules',appPath,vendorPath
    ],extensions: ['.js','.jsx','.mjs'],symlinks: false
  },

我们错过了什么吗？

谢谢。

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

custom-elementjavascriptreactjsreactjsreactjsreactjsstenciljswebpackwebpackwebpack