同一目录下不同文件中ES6导入行为不一致问题求助

这问题挺有意思的——同一个模块导入，两个文件表现居然不一样，而且import * as还能看到完整的导出对象，说明模块路径是对的，但就是命名导入出问题了。我遇到过类似的情况，大概率是这几个原因之一，你可以逐一排查：

1. 循环依赖在搞鬼 #

最常见的原因就是循环导入。比如你的第二个文件（或者它导入的某个模块）和components/partials之间形成了导入闭环：比如partials里导入了第二个文件，或者第二个文件导入的A模块又导入了partials。这种情况下，模块加载顺序会被打乱，当第二个文件加载时，PartialOne可能还没被初始化完成，所以拿到的是undefined，但整个模块对象已经被创建了，所以import * as能看到属性。

排查&解决：

• 手动梳理导入链，看看有没有循环。比如检查components/partials的代码里有没有导入第二个文件，或者第二个文件的依赖树里有没有绕回partials。
• 用构建工具的循环依赖检测插件（比如webpack的circular-dependency-plugin）自动定位问题。
• 重构代码打破循环：把循环依赖的逻辑抽成独立的公共模块，或者在需要使用的地方用动态导入延迟加载：

  // 第二个文件里换成动态导入
  import('components/partials').then(({ PartialOne }) => {
    console.log(PartialOne); // 这时候应该能拿到正确的函数了
  });
  

2. 模块导出是动态赋值的 #

如果components/partials里的PartialOne不是静态导出的，而是后续动态赋值的，也会出现这种情况。比如：

// components/partials.js
export let PartialOne;

// 比如在某个异步操作或者函数里才赋值
setTimeout(() => {
  PartialOne = () => { /* ... */ };
}, 0);

第一个文件可能因为加载顺序靠后，赋值已经完成了，而第二个文件加载时赋值还没执行，所以拿到undefined。但模块对象本身已经存在，所以import * as能看到这个属性（只是暂时是undefined）。

排查&解决：

• 打开components/partials的代码，确认PartialOne是直接静态导出的：

  // 改成这种静态导出
  export function PartialOne() { /* ... */ }
  // 或者
  export const PartialOne = () => { /* ... */ };
  

• 如果必须动态赋值，那就在使用前确保赋值完成，比如用Promise包裹导出逻辑，或者在第二个文件里延迟访问。

3. 第二个文件里有命名冲突 #

有没有可能第二个文件里，在导入PartialOne之后，又定义了同名的变量，把导入的覆盖了？比如：

// 第二个文件
import { PartialOne, PartialTwo } from 'components/partials';

// 后面不小心定义了同名变量
const PartialOne = undefined; // 或者其他赋值操作
console.log(PartialOne); // 自然是undefined

这种情况很容易忽略，尤其是文件比较长的时候。

排查&解决：

• 全局搜索第二个文件里的PartialOne，看看有没有后续的变量声明、赋值操作。
• 如果确实有冲突，要么重命名导入：

  import { PartialOne as PartialOneComponent } from 'components/partials';
  console.log(PartialOneComponent);
  

  要么重命名后续的变量。

4. 构建工具的缓存或解析异常 #

有时候开发服务器的缓存或者构建工具的模块解析bug也会导致这种诡异的问题。比如webpack、Vite这类工具的缓存可能让第二个文件加载了旧的模块版本，或者路径别名解析出现了细微差异（虽然import * as能看到属性，但也不能完全排除）。

排查&解决：

• 重启开发服务器，清理构建缓存（比如删除node_modules/.cache目录，或者执行工具自带的清理命令），然后重新构建项目。
• 检查项目的路径别名配置，确保components/partials在两个文件里解析的是同一个物理文件。

你可以先从循环依赖和命名冲突开始排查，这两个是最常见的原因。

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