d3.js error in React application (undefined is not an object (evaluating ‘this.document’))

I’m working on a project that includes a crossfiltering dashboard for data analysis. Initially, I used Chart.js, but it doesn’t natively support crossfiltering functionality.

After some research, I discovered the dc.js library and decided to implement it in my project. However, I’m encountering an error when the page first loads, and I’m finding it difficult to resolve the issue.

undefined is not an object (evaluating 'this.document')

Here is the code where I implemented dc.js:

import { barChart } from "dc";
import crossfilter from "crossfilter";

export class Dataset {
  data = [];
  rows = [];
  filters = [];
  columns = [];
  values = {};
  dimension = {};

  constructor(data, { rows, columns, filters, values }) {
    this.data = data;
    this.rows = rows;
    this.columns = columns;
    this.filters = filters;
    this.values = values;
  }

  get crossFilter() {
    return crossfilter(this.data);
  }

  run() {
    if (this.rows.length) {
      this.dimension.rows = [];
      this.dimension.rows.push(
        this.crossFilter.dimension((d) => {
          return `${this.rows.map((row) => `${row}=${d[row]}`).join(";")}`;
        })
      );
    }
    if (this.columns.length) {
      this.dimension.columns = [];
      this.dimension.columns.push(
        this.crossFilter.dimension((d) => {
          return `${this.columns
            .map((column) => `${column}=${d[column]}`)
            .join(";")}`;
        })
      );
    }

    for (let index = 0; index < this.rows.length; index++) {
      const row = this.rows[index];
      const dimensionRow = this.dimension.rows[index];
      this.dimension.values = dimensionRow.group().reduceCount((d) => d[row]);
    }
  }

  createChart(element) {
    const chart = new barChart(element);
    chart.width(780).height(300);
  }
}

App

  useEffect(() => {
    const rowValues = {};
    for (let key in values) {
      if (rows.includes(key)) {
        rowValues[key] = values[key];
      }
    }

    const dataset = new Dataset(data.current, { rows });
    dataset.run();
    console.log(dataset.dimension);
    setValue(rowValues);
  }, [rows]);

Please help me, solve this problem. Thanks advance!