ES6模块需script标签加type="module"才生效，否则import报错；模块默认defer；export default与具名导出可共存但不能多个default；import()支持动态路径和await；路径必须带扩展名或相对/绝对前缀。
ES6模块必须用 type="module" 才能生效
浏览器里直接写 import 和 export 会报错，不是语法错了，而是模块系统根本没启动。关键在 HTML 的 <script> 标签必须加 type="module" 属性，否则 JS 引擎按传统脚本模式执行，import 会被当成非法语句。
常见错误现象：Uncaught SyntaxError: Cannot use import statement outside a module —— 就是这个原因。
-
<script type="module" src="main.js"></script>是必须的，哪怕只有一行import - 不支持
<script type="module">import {foo} from './a.js';</script>这种内联写法（Chrome 127+ 开始支持，但兼容性差，别依赖） - 模块脚本默认是
defer行为：不会阻塞 HTML 解析，且按顺序执行
export 有两种写法，但 export default 和具名导出不能混用在同一个文件里
一个模块可以有多个 export，但只能有一个 export default。它本质是导出一个“默认值”，名字由导入方自定；而具名导出（export const x = 1 或 export {x}）必须用原名或重命名导入。
容易踩的坑：
立即学习“Java免费学习笔记（深入）”；
- 写了
export default function foo(){}，又写export const bar = 2—— 合法，没问题 - 写了
export default function foo(){}，又写export default class A{}—— 报错，重复默认导出 - 导入时写
import utils from './utils.js'，但源文件只有export const log = console.log（无 default）—— 报错：utils是undefined
/* utils.js */
export const log = console.log;
export function delay(ms) {
return new Promise(r => setTimeout(r, ms));
}
export default function greet(name) {
return `Hello, ${name}`;
}/* main.js */
import greet, { log, delay } from './utils.js'; // greet 来自 default，log/delay 来自具名导出动态 import() 是函数调用，支持表达式和条件加载，但返回 Promise
静态 import 必须在顶层、字面量路径、不能拼接字符串；而 import() 是运行时函数，路径可以是变量、可放在 if 里、甚至能用 await 等待。
典型使用场景：路由按需加载、大组件懒加载、插件条件加载。
-
import('./math.js').then(m => m.add(1,2))—— 必须处理 Promise -
const path = env === 'prod' ? './prod.js' : './dev.js'; const mod = await import(path);—— 路径可计算 - 不能写
import() { ... }或import('./a.js').add(1,2)——import()返回的是模块命名空间对象，不是导出的函数本身 - Webpack/Vite 会把
import()当作代码分割点，生成独立 chunk；纯浏览器环境也支持（Chrome 63+，Firefox 67+）
模块路径必须带扩展名或以 /、./、../ 开头，不能省略
ES6 模块规范强制要求路径是“有效模块说明符”（valid module specifier），浏览器不接受裸名如 import {foo} from 'lodash' —— 会直接 404，因为没有协议也没有相对/绝对前缀。
这意味着你没法像 Node.js 那样靠 node_modules 自动解析，也不能靠打包工具“假装”支持裸导入（那是构建时行为，非运行时）。
- ✅ 正确：
import {foo} from './lib/foo.js'（带.js） - ✅ 正确：
import {bar} from '/node_modules/lodash-es/index.js'（绝对路径 + .js） - ❌ 错误：
import {baz} from 'lodash'（裸包名，浏览器不认识） - ❌ 错误：
import {qux} from 'utils'（没扩展名也没前缀，解析失败）
如果真要支持裸导入，得靠构建工具（如 Vite 的 resolve.alias）或服务器配置（如用 import-map），但这属于工程层补丁，不是语言原生能力。
