Astro构建时无法解析JavaScript文件的问题求助

我正在尝试用Astro框架搭建网站，目前跟着官方教程一步步推进，但遇到了一个让我摸不着头脑的问题。我现在到了教程里要求在组件的script标签中引入JavaScript的步骤，按照文档描述，这个流程应该是“开箱即用”的——只要创建script标签并导入JS文件，Astro就会自动处理构建。

但实际情况是，不管是在本地运行构建命令，还是部署到Netlify时，都会出现下面的错误：

5:52:14 PM: 22:52:14 [ERROR] [vite] x Build failed in 15ms
5:52:14 PM: Could not resolve "../scripts/menu.js" from "src/pages/blog.astro?astro&type=script&index=0&lang.ts"
5:52:14 PM: file: /opt/build/repo/src/pages/blog.astro?astro&type=script&index=0&lang.ts
5:52:14 PM:   Stack trace:
5:52:14 PM:     at getRollupError (file:///opt/build/repo/node_modules/rollup/dist/es/shared/parseAst.js:396:41)
5:52:14 PM:     at ModuleLoader.handleInvalidResolvedId (file:///opt/build/repo/node_modules/rollup/dist/es/shared/node-entry.js:20216:24)
5:52:14 PM: ​
5:52:14 PM: "build.command" failed                                        
5:52:14 PM: ────────────────────────────────────────────────────────────────

下面是我编写的Astro/HTML代码：

<body>
  <Header />

  <h1>{pageTitle}</h1>
  <p>This is where I will post about my journey learning Astro.</p>
  
  <ul>
    <li><a href="/posts/post-1/">Post 1</a></li>
    <li><a href="/posts/post-2/">Post 2</a></li>
    <li><a href="/posts/post-3/">Post 3</a></li>
  </ul>
  
  <Footer />
<script>
  import '../scripts/menu.js';
</script>
</body>

还有menu.js的内容：

document.querySelector('.hamburger').addEventListener('click', () => {
    document.querySelector('.nav-links').classList.toggle('expanded');
  });

我谷歌搜索后尝试给script标签添加MIME类型，这样Astro确实不会再抛出构建错误了，但新问题是最终生成的网页里根本看不到这段JavaScript代码，等于没解决核心问题。有没有人能帮我分析下问题出在哪？

备注：内容来源于stack exchange，提问作者Mike P