According to the documentation, Chartjs (v4) grid styling is controlled using the options.scales[scaleId].grid namespace. I can control the styling globally of select elements using statements like:

Chart.defaults.scale.grid.display = true;
Chart.defaults.scale.grid.lineWidth = 5;

However, I can not seem to find the syntax for controlling defaults for individual axes using the [scaleId] portion of the above namespace. I have tried the following to no avail:

Chart.defaults.scales.x.grid.display = true;
Chart.defaults.scales['x'].grid.display = true;

What is the proper syntax to set defaults for the axes individually?

TLDR; I am setting global display properties in a separate file and importing those settings into each chart (I have over 20 charts) within a Vue 3 project.

chartDefaults.js

// Set project defaults

import Chart from "chart.js/auto"

// general
Chart.defaults.responsive = true;
Chart.defaults.maintainAspectRatio = false;

// animations
Chart.defaults.animation.duration = 2000;
Chart.defaults.animation.easing = 'easeInOutQuart';

...

I’ve inspected the Chart.defaults object, but I don’t see references to the individual axes within the defaults object.