带有动态加载的 Preact 和 react-redux 错误

编程问答 2022-05-10

问题描述

我正在使用 preact，并使用 webpack 代码拆分在我的代码中动态加载模块。 如果我使用脚本标签加载我的核心包，一切正常。如果我像下面的代码那样动态加载它，捆绑包就会中断：

const script = document.createElement('script');
script.src = 'bundle-location.js';
document.body.appendChild(script);

这是我得到的错误：

enter image description here

如果我在 Context.js 文件中添加断点，我可以看到问题：

enter image description here

在第一种情况下，如果使用 script 标签，那么 react__WEBPACK_IMPORTED_MODULE_0__ 实际上包含 preact。出于某种原因，如果我动态加载相同的脚本，则 preact 对象存在，但缺少其所有导出，包括“默认”导出。 请务必注意，如果我禁用代码拆分，则一切正常。

这是我的 webpack 配置：

const config = {
  mode: getMode(),resolve: {
    alias: {
      react: 'preact/compat','react-dom': 'preact/compat',},extensions: ['.ts','.tsx','.js'],module: {
    rules: [
      {
        test: /\.(js|jsx|ts|tsx)$/,exclude: /node_modules/,use: {
          loader: 'babel-loader',{
        test: /\.svg$/,use: [
          'babel-loader',{
            loader: 'react-svg-loader',query: {
              svgo: {
                pretty: true,plugins: [
                  {
                    removeStyleElement: true,{
                    removeViewBox: false,],}],plugins: [
    new webpack.DefinePlugin({
      PLUGINS_PATH: JSON.stringify(getPluginsPath()),}),entry: './src/index.ts',output: {
    path: path.resolve(__dirname,'./src/dist/bundle/'),filename: 'bundle.js',chunkFilename: '[name].js',publicPath: getPluginsPath(),};

module.exports = config;

非常感谢任何方向。

解决方法

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

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

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

code-splittingjavascriptpreactreact-reduxwebpackwebpackwebpack