I am working on a project on my Windows computer as well on my Macbook. I got a function that register components defined in certain directories globally like this:

require('./bootstrap');

import { createApp, h } from 'vue';
import { createInertiaApp } from '@inertiajs/inertia-vue3';
import { InertiaProgress } from '@inertiajs/progress';

/**
 * Third-party imports.
 */
import upperFirst from 'lodash/upperFirst';
import camelCase from 'lodash/camelCase';

const appName = window.document.getElementsByTagName('title')[0]?.innerText || 'Laravel';

/**
 * Register components from the ./components and ./components/core
 * directories. This way these components don't have to be imported
 * manually every time.
 *
 * The core components are the core of other components and contains
 * alerts, notifications, input fields etc.
 *
 * Base components are bigger components made upon the core components
 * and contain a combination of one or more of the core components. These
 * are usually components that contain a lot of code and have to be re-used
 * across the whole application.
 *
 * @param {Vue instance} app
 */
function registerGlobalComponents (app) {
  const requireComponent = require.context(
    './components' || './components/core' || './components/base',
    true,
    /\.vue$/
  );

  for (const file of requireComponent.keys()) {
    const componentConfig = requireComponent(file);
    const name = file
      .replace(/index.js/, '')
      .replace(/^\.\//, '')
      .replace(/\.\w+$/, '');
    const componentName = upperFirst(camelCase(name));

    app.component(componentName,
      componentConfig.default);
  }
}

createInertiaApp({
    title: (title) => `${title} - ${appName}`,
    resolve: (name) => require(`./Pages/${name}.vue`),
    setup({ el, app, props, plugin }) {

        const inertiaApp = createApp({ render: () => h(app, props) });

        inertiaApp.use(plugin);
        inertiaApp.mixin({ methods: { route } })
        registerGlobalComponents(inertiaApp);
        inertiaApp.mount(el);
    },
});

InertiaProgress.init({ color: '#4B5563' });

When I run npm run watch or dev or prod it compiles the code and successfully shows me the website on my Windows machine. But when I do this on my Macbook it throws the following error:

Can't resolve './components' in '/Users/bas/Sites/trainfit/resources/js'

Is there a reason why this works on a Windows machine but not on a machine that runs on MacOS?

Some more information about my project:

• Made with Vue and Inertiajs
• Running this code from Visual Studio Code