时间戳

首页 > 解决方案 > 我的导入导出功能有什么问题？

javascript - 我的导入导出功能有什么问题？

问题描述

我正在尝试从我的snake.js 导入我的函数“更新”和“绘制”，但控制台上没有显示任何内容，也没有宣布任何错误......我的代码有问题，有人可以帮助我吗？太感谢了！

这是我的game.js：

    import { update as updateSnake, draw as drawSnake, SNAKE_SPEED } from "/condition/snake.js"; //moves 2 times per second
    
    let lastRenderTime = 0
    
    
    function main(currentTime) {
        const secondsSinceLastRender = (currentTime - lastRenderTime) / 1000
        window.requestAnimationFrame(main)
        if (secondsSinceLastRender < 1 / SNAKE_SPEED) return
        lastRenderTime = currentTime
    
    
    
    }
    window.requestAnimationFrame(main)
    
    function update() {
        updateSnake()
    }
    
    function draw() {
        drawSnake()
    }

This is my snake.js:

    export const SNAKE_SPEED = 1
    
    export function update() {
        console.log('update snake')
    }
    
    export function draw() {
        console.log('draw snake')

这是我的html：

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Snake</title>
    
</head>

<body>
    <div id="game-board"></div>

    <script src="game.js" type="module"></script>
</body>

</html>

我的目录：目录

标签： javascriptimportmoduleexport

解决方案

您导入两个函数并在您的update()anddraw()函数中调用它们，但实际上并没有调用后两个函数。我想您的main()函数应该代表一个游戏循环，您可以在其中更新游戏逻辑并渲染游戏，这将使它看起来像这样：

function main(currentTime) {
    const secondsSinceLastRender = (currentTime - lastRenderTime) / 1000
    window.requestAnimationFrame(main)
    if (secondsSinceLastRender < 1 / SNAKE_SPEED) return
    lastRenderTime = currentTime
    update();
    draw();
}

main也许您确实这样做了，但没有将其包含在示例代码中，因为函数末尾有很多空格。

否则，对于 ESM 模块，您的导入/导出就很好了。

推荐阅读