1

我已经构建了一个 webpack 项目，它有一个导出默认函数的入口点。本项目可以导入其他项目，默认功能可以静态导入如下：

import myFunction from "MyProject"

myFunction()

如果我尝试动态导入模块，则该模块似乎没有导出。

import(`https://example.com/myproject.mjs`).then(module => {
  module.default() // <-- TypeError: module.default is not a function
})

项目的 webpack 有如下配置：

module.exports = {
  mode: 'production',
  entry: {
    main: './src/index.js'
  },
  output: {
    filename: '[name].mjs',
    path: path.resolve(__dirname, 'dist')
  },
  module: {
    rules: [
      {
        test: /\.js$/,
        exclude: /(node_modules|libs)/,
        use: 'babel-loader'
      }
    ]
  },
  optimization: {
    minimize: true,
    minimizer: [new TerserPlugin({
      sourceMap: true,
      extractComments: false,
      exclude: "tests"
    })]
  },
  plugins: [
    new CleanWebpackPlugin(),
    new ESLintPlugin({
      fix: true,
      emitWarning: true,
      emitError: true,
      files: [
        'src/**/*.js',
        'test/**/*.js'
      ]
    }),
    new PrettierPlugin(),
    new FileManagerPlugin({
      onEnd: [
        {
          copy: [
            {
              source: './dist/**',
              destination: './test-runner/'
            }
          ]
        }
      ]
    })
  ],
  watch: false,
  devtool: 'source-map'
}

是否可以像这样动态加载 webpack 构建的项目？

4

0 回答 0