在浏览器的普通 JavaScript 环境中,如果出现 "Uncaught SyntaxError: Cannot use import statement outside a module" 的错误,通常有以下几个原因:

  1. 缺少 type="module" 属性 - 当使用 import/export 语法时,浏览器需要知道该脚本是一个 ECMAScript 模块。在 HTML 的 script 标签中添加 type="module" 属性可以解决此问题,例如:
<script type="module" src="your-script.js"></script>
  1. 本地文件系统协议 - 在本地浏览器中,如果使用文件系统协议 (file://) 打开网页,import/export 语法可能不被允许,这是为了防止本地文件系统的滥用。建议使用 HTTP 服务器来测试包含 import/export 语法的页面(测试也得需要type="module")。
  2. 浏览器不支持模块 - 旧版本的浏览器可能不支持 import/export 语法,特别是 IE 浏览器。确保你的浏览器支持 ECMAScript 模块(ES modules)。

请注意,对于 import/export 语法的使用,建议在 Node.js 或使用构建工具(例如 webpack、Rollup 等)的情况下进行开发和部署,因为它们支持模块化的打包和管理。

对于导入本地js文件注意要用相对路径或者绝对路径 不然会报错如下: Uncaught TypeError: Failed to resolve module specifier "2.js". Relative references must start with either "/", "./", or "../".

加上以后运行正常