无法在复制-webpack-plugin之后使用模块外部的导入语句。

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

通过在模块脚本标记中导入和体，我能够解决这个问题：

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