copy-webpack-plugin 后无法在模块外使用 import 语句

Question

我已将带有 JS 库的 git 子模块添加到我的 Vue.js 项目中。它被放置在根目录中。我想将 <script> 标记添加到我的 index.html 以从此 git 子模块导入 js 文件。所以，我已经配置 webpack 以这种方式从 git 子模块复制文件：

vue.config.js

    configureWebpack: {
        plugins: [
          new CopyPlugin(
            {
               patterns: [
                 {
                   from: "./library-dir",
                   to: "./library-dir"
                 }
               ]  
            }
          )
        ]
     }

然后我将这一行添加到我的 index.html:

<script src="./library-dir/script.js"></script>

但是当我运行应用程序时，我在 ./library-dir/script.js 文件中遇到错误：

Uncaught SyntaxError: Cannot use import statement outside a module

它指向相对导入的行：

import { Utils } from "./utils/utils.js"

如何解析子模块中的此类相对路径？

如果有人能提供帮助，我们将不胜感激。

Answer 1

我能够通过在模块脚本标签中导入 sumbodule 来解决问题：

<script type="module">
    import lib from "./library-dir/script.js";
    window.lib = lib;
</script>

copy-webpack-plugin 后无法在模块外使用 import 语句

Cannot use import statement outside a module after copy-webpack-plugin

git

git-submodules

webpack

vue.js