Question

我正在为浏览器编写JavaScript，我的script.js类似于

<!DOCTYPE html>
<html>
    <head>
        <title>Image Slider</title>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <link rel="stylesheet" type="text/css" href="main.css">
    </head>
    <body>

        <div id="meh">
            <div id="main-container">
                <div id="slider-container">
                    <img src="https://copmec.com/images/headers/header40.jpg" class="img" id="lastClone">
                    <img src="https://thepunctuationshow.com/rw_common/themes/volcano/images/editable_images/1.jpg"                               class="img">
                    <img src="https://skopelosweb.gr/images/biking.jpg" class="img">
                    <img src="https://alphacomputer.rw/images/bannerbg3.jpg" class="img">
                </div>
                <button id="prevBtn">prev</button>
                <button id="nextBtn">next</button>
            </div>
        </div>
        
    </body>
</html>

然后我在浏览器中找到了这个

import { foo, bar } from "./lib/sth.js"
function main() { ... }

但是它一直在给我这个错误：

未捕获的ReferenceError：未定义main 在onload（（index）：7）

为什么现在定义了我的主要人员？在使用type = module之前，它可以正常工作，但是对于import语句，我相信它必须是type = module

Answer 1

感谢@HereticMonkey和@FelixKling！

window.onload = function() { ... }

可以解决我的问题。但是我很困惑为什么导入是这样设计的。假设我只想在脚本中使用某个库以便导入，为什么这也使我的脚本也必须是模块？

我的javascript模块中的函数未定义

1 个答案: