Can’t seem to get visual-override.js to work

Howdy,

I’m messing around making a theme from scratch/general learning and I can’t get the visual-override.js file to work – even when I dumbed down the code to what’s below.  Chrome developer tools show nothing so I’m assuming I’m doing something wrong with the override file.  I created the file and placed it in the root directory of my theme (which is entirely barebones at the moment).

// visual-override.js


// Just trying to see if I can get this little color override to work
var generateOverride = function(params) {
    return "a { color: #0FFFF0; }";
};

module.exports = generateOverride;

/* main.css */


/* These were set in the config file and when the colors didn't override I decided to test with the above JavaScript and a link.
   Just including this to show that the css file is pretty much empty */
:root {
    --body-bg-color: #000000;
    --text-color:  #FFFFFF;
}

body {
    background: var(--body-bg-color);
    color: var(--text-color);
}

{{! index.hbs }}

{{! Just has opening tags }}
{{> head}}

Link

{{! Just has closing tags }}
{{> footer}}

I have a feeling it’s an obvious fix, but I’m not seeing it – especially since I don’t really know how to use JavaScript off the top of my head.  Thanks for your help!