ES6中如何导入名称包含特殊字符的模块导出项

报错的核心原因是tomorrow-night中的中划线不属于合法JavaScript标识符，直接写在导入解构的大括号中时，JS引擎会将其解析为tomorrow减night的运算表达式，无法匹配到对应的导出项。

解决方式 #

使用字符串字面量标注导出名配合as重命名即可，正确写法如下：

import { 'tomorrow-night' as tomorrowNight } from 'react-syntax-highlighter/dist/esm/styles/hljs';

补充说明 #

• 用单/双引号包裹含特殊字符的导出名，可精准匹配模块的导出规则
• as后需定义合法的JS标识符作为别名，后续代码直接使用该别名调用对应导出内容即可
• 该方案通用适配所有包含特殊字符、空格、数字开头等不符合JS标识符规范的导出项导入场景

内容的提问来源于stack exchange，提问作者Toby Maguire