craco.config.js

const CracoAlias = require("craco-alias");
const webpack = require("webpack");

module.exports = {
  webpack: {
    configure: {
      resolve: {
        fallback: {
          util: require.resolve("util"),
          stream: require.resolve("stream-browserify"),
          crypto: require.resolve("crypto-browserify"),
          process: require.resolve("process/browser"),
          zlib: require.resolve("browserify-zlib"),
          buffer: require.resolve("buffer"),
          asset: require.resolve("assert"),
          "react/jsx-runtime": "react/jsx-runtime.js",
          "react/jsx-dev-runtime": "react/jsx-dev-runtime.js",
        },
      },
      plugins: [
        new webpack.DefinePlugin({
          process: { env: {} },
        }),
        new webpack.ProvidePlugin({
          Buffer: ["buffer", "Buffer"],
          process: "process/browser",
        }),
      ],
    },
  },
  style: {
    postOptions: {
      plugins: [require("tailwindcss"), require("autoprefixer")],
    },
  },
  plugins: [
    {
      plugin: CracoAlias,
      options: {
        source: "tsconfig",
        // baseUrl SHOULD be specified
        // plugin does not take it from tsconfig
        baseUrl: "./src",
        // tsConfigPath should point to the file where "baseUrl" and "paths" are specified
        tsConfigPath: "./tsconfig.extend.json",
      },
    },
  ],
};