为何出现Uncaught SyntaxError: Unexpected token 'export'但import仍正常工作？

• 为啥报错？
  你在appearance.js里写了export，但浏览器加载这个文件时没把它当成ES模块处理——只有加了type='module'的脚本，浏览器才会识别import/export语法。table-gen.js加了type='module'所以能正常导入，但appearance.js没加，浏览器按普通脚本解析，自然认不出export关键字，就抛错了。

• 怎么改？

  1. 给index.html里的appearance.js脚本标签也加上type='module'：

     <script type="module" src="appearance.js"></script>
     <script type="module" src="table-gen.js"></script>
     

  2. 检查table-gen.js里的导入路径是否正确，比如同目录下要写相对路径：

     import { genModBtn } from './appearance.js';
     

• 额外提醒
  模块脚本有自己的独立作用域，不会往全局挂变量。之前如果是靠全局变量传值的逻辑，改成模块后必须通过import/export来传递，别再依赖全局了。另外服务器环境下文件名大小写要匹配，不然会找不到文件。

内容的提问来源于stack exchange，提问作者Murilo Cabral