React中如何访问config.js的AccessToken，解决导入后TOKEN为undefined并忽略文件

1. 修正config.js的导出方式 #

你当前的config.js只是在模块内部定义了变量，但没有通过ES模块语法对外暴露——这是导致import { config }拿到undefined的核心原因。修改你的config.js代码，匹配ES模块的导出规则：

// 改为ES模块命名导出，和你当前的import语法完全对应
export const config = { 
  TOKEN : '你的实际令牌内容' 
};

如果你更习惯用默认导出，也可以这样写：

// 默认导出写法
export default { 
  TOKEN : '你的实际令牌内容' 
};
// 此时导入语句要改成：
// import config from './config'

2. 验证导入路径的正确性 #

确认import { config } from './config'的路径没有问题：

• 检查文件名大小写：在macOS/Linux这类区分大小写的系统中，config.js和Config.js是两个不同的文件，要保证导入时的文件名和实际文件名完全一致
• 检查相对路径：如果你的组件文件和config.js不在同一目录，要调整路径层级（比如用../config表示上一级目录）

3. 确保.gitignore正确忽略config.js #

在项目根目录的.gitignore文件中添加一行，确保包含敏感令牌的配置文件不会被提交到Git仓库：

config.js

额外排查点 #

如果以上步骤做完还是有问题，可以试试这些操作：

• 重启你的React开发服务器，有时候缓存会导致代码修改无法即时生效
• 检查config.js是否被Webpack等构建工具的配置规则意外忽略

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