Error: Caching was left unconfigured. Babel's plugins when I installed Font Awesome to my react app

Question

I would like to use Font Awesome in my React app, but when I have install npm of Font Awesome I had this error:

Error: Caching was left unconfigured. Babel's plugins, presets, and .babelrc.js files can be configured
  for various types of caching, using the first param of their handler functions:
  module.exports = function(api) {
    // The API exposes the following:
    // Cache the returned value forever and don't call this function again.
    api.cache(true);
    // Don't cache at all. Not recommended because it will be very slow.
    api.cache(false);
    // Cached based on the value of some function. If this function returns a value different from
    // a previously-encountered value, the plugins will re-evaluate.
    var env = api.cache(() => process.env.NODE_ENV);
    // If testing for a specific env, we recommend specifics to avoid instantiating a plugin for
    // any possible NODE_ENV value that might come up during plugin execution.
    var isProd = api.cache(() => process.env.NODE_ENV === "production");
    // .cache(fn) will perform a linear search though instances to find the matching plugin based
    // based on previous instantiated plugins. If you want to recreate the plugin and discard the
    // previous instance whenever something changes, you may use:
    var isProd = api.cache.invalidate(() => process.env.NODE_ENV === "production");
    // Note, we also expose the following more-verbose versions of the above examples:
    api.cache.forever(); // api.cache(true)
    api.cache.never();   // api.cache(false)
    api.cache.using(fn); // api.cache(fn)
    // Return the value that will be cached.
    return { };
  };

and this is my dev dependencies:

"devDependencies": {
    "@babel/core": "^7.17.5",
    "@babel/preset-env": "^7.16.11",
    "babel-loader": "^8.2.3",
    "webpack": "^5.70.0"
  }

I have created 2 new files like in tutorial babel.config.js:

module.exports = function (api) {
  return {
    plugins: ['macros'],
  }
}

and babel-plugin-macros.config.js:

module.exports = {
  'fontawesome-svg-core': {
    'license': 'free'
  }
}

but I have still this bug

Answer 1

For fix this bug I chenged a litte babel.config.js:

module.exports = function (api) {
    api.cache(true);
    return {
      plugins: ['macros'],
    }
  }