React中使用node-adodb模块出现Can't resolve 'child_process'错误求助

根本原因 #

node-adodb是仅能在Node.js后端环境运行的模块，它依赖child_process、fs等Node.js专属内置API，而React运行在浏览器环境中，这些API本身不存在，因此直接在前端代码中引入该模块必然报错。你之前尝试的两种方法只是屏蔽了打包时的错误提示，但无法让模块在浏览器里正常工作——因为核心功能依赖的后端环境缺失。

可行解决方案 #

1. 后端封装接口（推荐）

把node-adodb的数据库操作逻辑放在Node.js后端服务中，前端通过HTTP请求调用后端接口获取数据。

后端示例（Express框架）：

const express = require('express');
const ADODB = require('node-adodb');
const cors = require('cors'); // 解决跨域问题
const app = express();

app.use(cors());

// 封装ADODB查询接口
app.get('/api/adodb/query', async (req, res) => {
  try {
    // 初始化ADODB连接（根据你的数据库配置修改）
    const connection = ADODB.open('Provider=Microsoft.Jet.OLEDB.4.0;Data Source=./your-database.mdb;');
    // 执行查询
    const queryResult = await connection.query('SELECT * FROM your-table');
    res.json(queryResult);
  } catch (error) {
    res.status(500).json({ error: error.message });
  }
});

app.listen(3001, () => {
  console.log('后端服务运行在 http://localhost:3001');
});

前端React调用示例：

import { useEffect, useState } from 'react';

function App() {
  const [data, setData] = useState([]);
  const [error, setError] = useState('');

  useEffect(() => {
    // 调用后端接口
    fetch('http://localhost:3001/api/adodb/query')
      .then(res => res.json())
      .then(result => setData(result))
      .catch(err => setError(err.message));
  }, []);

  return (
    <div>
      {error && <p>错误：{error}</p>}
      <ul>
        {data.map(item => (
          <li key={item.id}>{item.name}</li>
        ))}
      </ul>
    </div>
  );
}

export default App;

2. 静态数据替代（非实时场景）

如果你的数据库数据不需要实时更新，可以提前用Node.js脚本通过node-adodb查询数据，导出为JSON/CSV文件，前端直接加载静态文件即可。

导出数据脚本示例：

const ADODB = require('node-adodb');
const fs = require('fs');

async function exportData() {
  const connection = ADODB.open('Provider=Microsoft.Jet.OLEDB.4.0;Data Source=./your-database.mdb;');
  const data = await connection.query('SELECT * FROM your-table');
  fs.writeFileSync('./public/data.json', JSON.stringify(data));
}

exportData();

前端直接导入静态JSON：

import data from './data.json';

function App() {
  return (
    <ul>
      {data.map(item => (
        <li key={item.id}>{item.name}</li>
      ))}
    </ul>
  );
}

为什么之前的方法无效 #

• package.json中添加"browser": { "child_process": false }：只是告诉打包工具忽略child_process模块的引入，但node-adodb内部逻辑依然依赖该模块，运行时会直接崩溃。
• webpack配置node: { child_process: "empty" }：会把child_process替换为空对象，同样导致node-adodb调用相关API时报错，无法完成数据库操作。

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