MagicMirrorOrg/MagicMirror · warning

WARNING! Your custom css file was moved from ${global.root_p

Error message

WARNING! Your custom css file was moved from ${global.root_path}/css/custom.css to ${global.root_path}/${env.customCss}

What it means

On startup, App() checks for the legacy custom stylesheet at css/custom.css. If the configured target (env.customCss, default config/custom.css) doesn't exist but the old file does, it renames the file to the new location and logs this migration warning. It's informational: the move already happened; only a failure to rename falls into the follow-up warning.

Source

Thrown at js/app.js:205

		try {
			const configObj = Utils.loadConfig();
			global.config = configObj.fullConf;
			// Keep a copy of the redacted config to later verify module secret permissions
			global.configRedacted = configObj.redactedConf;
			const config = global.config;
			Utils.checkConfigFile(configObj);

			global.defaultModulesDir = config.defaultModulesDir;
			defaultModules = require(`${global.root_path}/${global.defaultModulesDir}/defaultmodules`);

			Log.setLogLevel(config.logLevel);

			env = getEnvVarsAsObj();
			// check for deprecated css/custom.css and move it to new location
			if ((!fs.existsSync(`${global.root_path}/${env.customCss}`)) && (fs.existsSync(`${global.root_path}/css/custom.css`))) {
				try {
					fs.renameSync(`${global.root_path}/css/custom.css`, `${global.root_path}/${env.customCss}`);
					Log.warn(`WARNING! Your custom css file was moved from ${global.root_path}/css/custom.css to ${global.root_path}/${env.customCss}`);
				} catch {
					Log.warn("WARNING! Your custom css file is currently located in the css folder. Please move it to the config folder!");
				}
			}

			// get the used module positions
			Utils.getModulePositions();

			let modules = [];
			for (const module of config.modules) {
				if (module.disabled) continue;
				if (module.module) {
					if (Utils.moduleHasValidPosition(module.position) || typeof (module.position) === "undefined") {
						// Only add this module to be loaded if it is not a duplicate (repeated instance of the same module)
						if (!modules.includes(module.module)) {
							modules.push(module.module);
						}
					} else {

View on GitHub (pinned to 4b4a59534f)

Solutions

  1. No action needed — the file was moved automatically; verify your styles load from the new path (default config/custom.css).
  2. Update deployment/backup scripts and Docker volume mounts to reference the new css path.
  3. If you rely on the old location intentionally, keep it synchronized or set the customCss env var appropriately.

Example fix

// before
volumes: ["./css/custom.css:/opt/magic-mirror/css/custom.css"]
// after
volumes: ["./custom.css:/opt/magic-mirror/config/custom.css"]
Defensive patterns

Strategy: fallback

Validate before calling

const fs = require("fs");
const target = `${global.root_path}/config/custom.css`;
const legacy = `${global.root_path}/css/custom.css`;
if (!fs.existsSync(target) && fs.existsSync(legacy)) {
  console.log("Legacy custom.css will be migrated on next start");
}

Try / catch

// wrap any manual migration so a failure doesn't block startup
try {
  fs.renameSync("css/custom.css", "config/custom.css");
} catch {
  console.warn("Move css/custom.css to config/custom.css manually");
}

Prevention

When it happens

Trigger: First start after upgrading MagicMirror² while the user's custom.css still resides at <root>/css/custom.css and <root>/<env.customCss> (default config/custom.css) does not exist yet.

Common situations: Upgrading an old install in place; Docker containers mounting only css/custom.css; overridden CUSTOMCSS env var pointing elsewhere while old file lingers.

Related errors


AI-assisted analysis of MagicMirrorOrg/MagicMirror@4b4a59534f (2026-08-31). Data as JSON: /api/errors/40f09d02da537f05. Report an issue: GitHub.