Can’t solve Ambiguous Indirect Export error

So I’m working on a MERN project with Vite that requires rendering data from a cluster out to the page. No matter what I do, I keep getting uncaught syntaxerror ambiguous indirect export. The errors get logged in App.jsx, and I’m importing from a module in my conn.js file. I’ve been reading everything I can on why this error might happen, but nothing seems to work. So I’m hoping some other eyes on the code will help.

This is my App.jsx

import { useState, useEffect } from 'react'
import React from 'react'

import { connectToServer, getDb } from "../../server/db/conn";

import Menu from './components/Menu'
import Traits from './components/Traits'
import Levels from './components/Levels'

function App() {

    const [data, setData] = useState([]);

    useEffect(() => {
        connectToServer((err) => {
          if (err) {
            console.error(err);
          } else {
            const db = getDb();
            console.log(db)
            const usersCollection = db.collection("users");
            usersCollection
              .find()
              .toArray()
              .then((result) => {
                setData(result);
              })
              .catch((err) => {
                console.error(err);
              });
          }
        });
      }, []);

  return (
    <div className="App">
            <Menu />
        <div className="main-container">
            <div className="main-column-left">
                <Traits />
                <Levels />
            </div>
            <div className="main-column-right">
                <div className="main-right-upper">
                    <div className="Stats-container">
                        {/* Stats component*/}
                    </div>
                    <div className="Conditions-container">
                        {/* Conditions component */}
                    </div>
                </div>
                <div className="main-right-lower">
                    <div className="Skills-container">
                        {/* Skills component */}
                    </div>
                    <div className="Inventory-container">
                        {/* Inventory component */}
                    </div>
                </div>
            </div>
        </div>
    </div>
  )
}

export default App

And this is the conn.js file

const { MongoClient } = require("mongodb");
const Db = process.env.ATLAS_URI;
const client = new MongoClient(Db, {
  useNewUrlParser: true,
  useUnifiedTopology: true,
});
 
let _db;
 
module.exports = {
  connectToServer: function (callback) {
    client.connect(function (err, db) {
      if (db)
      {
        _db = db.db("testdb");
        console.log("Successfully connected to MongoDB."); 
      }
      return callback(err);
         });
  },
 
  getDb: function () {
    return _db;
  },
};

And the server.js file for good measure.

const express = require("express");
const app = express();
const cors = require("cors");
require("dotenv").config({ path: "./config.env" });
const port = process.env.PORT || 5000;
app.use(cors());
app.use(express.json());

const dbo = require("./db/conn");

app.listen(port, () => {
  dbo.connectToServer(function (err) {
    if (err) console.log(err);
  });
  console.log(`Server is running on port: ${port}`);
});

I’ve tried renaming / changing the way they’re exported / exporting them one at a time, but nothing is working.