How to load config data from file?

[idoodler]

@acimail01 This is because the require function is not available in the browser. Are you using the server only mode?

[acimail01]

no, it is the kiosk mode. but I also tried the serveronly mode.

[idoodler]

@acimail01 Start MagicMirror in debug mode with npm start dev, it will open the developer tools. Then look for any red lines in the console.

If you can’t find the developer tools you can open it with CTRL-SHIFT-I

[acimail01]

Error message is:
Uncaught ReferenceError: require is not defined at config.js:15

[idoodler]

@acimail01 Ok, I just got an idea.

Place your json somewhere in the config folder and place the following function in your config.js.

function loadJSON(filePath) {
    if (typeof module !== "undefined") {
        return require(filePath);
    } else {
        try {
            return JSON.parse($.ajax({
                type: "GET",
                url: filePath,
                async: false
            }).responseText);
        } catch (e) {
            console.error(e);
            return {};
        }
    }
}

And call it like:

modules: [
	loadJSON("config/clock.json")
]

This function will synchronisly load the given JSON, serializes it and returns it. This code is completly untestet, but it should work anyway:)

Edit: I just updated my answer to also work with node.js

[acimail01]

thank you but wont work also.
Error:
ReferenceError: $ is not defined at loadJSON

I want to have all API keys and passwords from a common location and not scattered in the config.js, Hence the thought with a (yml) file.
maybe this can be solved via an array variable in the config.js or similar.

[idoodler]

@acimail01 Ok, we can fix the $ is not defined at loadJSON.

Replace the function with the following which uses good old XMLHttpRequest:

fuction loadJSON(filePath) {
    if (typeof module !== "undefined") {
        return require(filePath);
    } else {
        try {
            var xmlhttp = new XMLHttpRequest();
            xmlhttp.open("GET", filePath, false);
            xmlhttp.send();
            if (xmlhttp.status === 200) {
                return JSON.parse(xmlhttp.responseText);
            } else {
                throw "Unexpected status code!";
            }
        } catch (e) {
            console.error(e);
            return {};
        }
    }
}

[telmini]

Did you manage to make this work? I’m trying to do kinda the same.

Thanks