/**
 *    @module
 *    @author daemon.devin <daemon.devin@gmail.com>
 *
 *    @param {String}   file - The path of the file you want to load.
 *    @param {Function} callback (optional) - Called after script load.
 */
var loader = loader || (Function() {
    return {
    	
    	load: function(file, callback) {

            var script = document.createElement('script');
            script.src = file, script.async = true;
            
  			// If defined, execute the callback after checking 
  			// if the script has been successfully loaded.
            if (callback !== undefined) {
            	
            	// IE calls `script.onreadystatechange()` continuously
            	// as the script loads. Use `script.onreadystatechange()`
            	// to check if the script has finished loading.
	        script.onreadystatechange = function() {
	                
	            // When the script finishes loading, IE sets 
	            // `script.readyState` to either 'loaded' or 'complete'.
	            if (script.readyState === 'loaded' ||
	                script.readyState === 'complete') {
	                    
                  	// Set `onreadystatechange()` to null to prevent 
                  	// it from firing again.
	                script.onreadystatechange = null;
	                    
	                // Execute the callback.
	                callback (file );
	            }
	        };
	            
	        // The following is one of the reasons IE is infereor
            // to all modern browsers.
	        script.onload = function () {
	            callback ( file );
	        };
            }
            
  			// Add the loaded script to the end of the document 
  			// so it won't hinder the rest of the page from loading.
            document.body.appendChild(script);
        } 
    };
}());

// Define your class
class MyModule {
  constructor($) {
    this.$ = $;
  }
  
  // Add methods and properties here
}

// Environment detection and initialization
(function() {
  if (typeof require === 'function' && typeof exports === 'object' && typeof module === 'object') {
    // CommonJS
    module.exports = MyModule;
  } else if (typeof define === 'function' && define.amd) {
    // AMD
    define(['jquery'], function($) {
      return new MyModule($);
    });
  } else {
    // Global
    if (typeof window.jQuery !== 'undefined') {
      window.MyModule = MyModule;
    }
  }
})();

// file data.json

{
"localItems": {
	"items": [
      {
		"title": "Halabut",
		"type": "string",
        "status": false
		},
			{
        "title": "Taco",
		"type": "string",
        "status": true
		},
      {
        "title": "Fish",
		"type": "string",
        "status": true
		},
      {
        "title": "Pork",
		"type": "string",
        "status": false
		}
		]
	}
}




//js file must be a module
// <script src="scripts.js" defer type="module"></script>

// JS file 
import data from "./data.json" assert { type: "json" };
const {localItems} = data;
const JSONDATA = localItems['items'];

import { realpathSync as realpath, accessSync as access, existsSync as exists } from 'fs'
import { dirname } from 'path'

/**
 * IIFE to resolve Magento document root
 * @returns <string> Returns Magento document root
 */
export const mageRoot = (() => {
    let mageRoot = dirname(realpath(import.meta.url.slice(7)))

    while (!(exists(`${ mageRoot }/app/Mage.php`) || exists(`${ mageRoot }/bin/magento`))) {
        mageRoot = dirname(mageRoot)
    }

    return mageRoot
})()

<?php

$mageRoot = __DIR__;

while (!(file_exists($mageRoot . '/app/Mage.php') || file_exists($mageRoot . '/bin/magento'))) {
    $mageRoot = dirname($mageRoot);
}

return $mageRoot;