Complete Walkthrough - Install MagicMirror on a PC - Windows 7/10

[sdetweil]

@killk I had no problem

Win 10, under Vmware

git clone

npm install
and in vendors and fonts
edit the package.json
copy the default config.js from the sample

npm start

[mounir]

@mykle1 how can i resolve this ?
‘DISPLAY’ is not recognized as an internal or external command,
operable program or batch file.

[sdetweil]

@mounir have to scan further back
see
https://forum.magicmirror.builders/topic/4089/complete-walkthrough-install-magicmirror-on-a-pc-windows-7-10/141?_=1638708846564

[mounir]

@sdetweil no i see this
listen EACCES: permission denied 127.0.0.1:8080
can you help me fix it

[sdetweil]

@mounir where do u see that?

u are installing in cmd terminal window, right?
not PowerShell

[mounir]

@mounir yes in cmd

[sdetweil]

@mounir is this windows 10, or 11?

never seen this. installed on windows 11 last week to test

are u running any other web server apps?

[mounir]

@sdetweil i’m in windows 11 but there is no webserver running

[sdetweil]

@mounir read this
https://superuser.com/questions/1437780/how-to-fix-listen-eacces-permission-denied-on-any-port/1568476

u can change the port in MagicMirror\config\config.js

[mounir]

@sdetweil thank you it works when i’m changing the port in the config.js

[sdetweil]

Note for v ersion 2.18 a little twist
do

 npm install --only=prod

otherwise the developer dependencies will be installed too, and fail, causing electron not to be installed.

then
the additional steps are the same

cd fonts
npm install
cd ..\vendor
npm install
cd ..

and edit package.json to change the start line as shown in prior posts

new info for change of start line in package.json, with node 16
should be like this (earlier worked with node 14,)

"start": "node_modules\\.bin\\electron js\\electron.js",

[Pearce]

I went through the installation guide and got this error:

$ npm start

magicmirror@2.18.0 start

DISPLAY=“${DISPLAY:=:0}” ./node_modules/.bin/electron js/electron.js

‘DISPLAY’ is not recognized as an internal or external command,

operable program or batch file.

[sdetweil]

@pearce further up
https://forum.magicmirror.builders/topic/4089/complete-walkthrough-install-magicmirror-on-a-pc-windows-7-10/141?_=1638708846564

[N6NG]

Hi all… Looks like a lot of people are trying this… I’m going for it myself but ran into this problem…
When I try to do the
git clone https://github.com/MichMich/MagicMirror.git

I get the following error.

N6NG@Main-Computer-in-Ham-Shack MINGW64 /
$ git clone https://github.com/MichMich/MagicMirror.git
fatal: could not create work tree dir ‘MagicMirror’: Permission denied
Anyone figured out how to change permissions… sudo isn’t recognized yet.
Dennis

[sdetweil]

@n6ng no mingw,
just normal windows prompt

[swvalenti]

@sdetweil I installed MagicMirror no issues on Windows 11 but get undefined on several modules. Here is npm start dev

Refused to execute inline script because it violates the following Content Security Policy directive: "script-src 'self'". Either the 'unsafe-inline' keyword, a hash ('sha256-+VvWeRXLFRBjsYaMznmUQGiO1Vl3+a2jdYPOrV4EIp8='), or a nonce ('nonce-...') is required to enable inline execution.

main.js:481 Initializing MagicMirror.
translator.js:128 Loading core translation file: translations/en.json
translator.js:146 Loading core translation fallback file: translations/en.json
loader.js:184 Load script: modules/default/alert/alert.js
module.js:509 Module registered: alert
loader.js:155 Bootstrapping module: alert
loader.js:184 Load script: modules/default/alert/notificationFx.js
loader.js:160 Scripts loaded for: alert
loader.js:203 Load stylesheet: vendor/css/font-awesome.css
loader.js:203 Load stylesheet: modules/default/alert/./styles/notificationFx.css
loader.js:203 Load stylesheet: modules/default/alert/./styles/center.css
loader.js:162 Styles loaded for: alert
translator.js:107 alert - Load translationfalse: translations/en.json
translator.js:107 alert - Load translation fallback: translations/bg.json
loader.js:164 Translations loaded for: alert
loader.js:184 Load script: modules/default/updatenotification/updatenotification.js
module.js:509 Module registered: updatenotification
loader.js:155 Bootstrapping module: updatenotification
loader.js:160 Scripts loaded for: updatenotification
loader.js:203 Load stylesheet: modules/default/updatenotification/updatenotification.css
loader.js:162 Styles loaded for: updatenotification
loader.js:164 Translations loaded for: updatenotification
loader.js:184 Load script: modules/default/clock/clock.js
module.js:509 Module registered: clock
loader.js:155 Bootstrapping module: clock
loader.js:184 Load script: vendor/node_modules/moment/min/moment-with-locales.js
loader.js:184 Load script: vendor/node_modules/moment-timezone/builds/moment-timezone-with-data.js
loader.js:184 Load script: vendor/node_modules/suncalc/suncalc.js
loader.js:160 Scripts loaded for: clock
loader.js:203 Load stylesheet: modules/default/clock/clock_styles.css
loader.js:162 Styles loaded for: clock
loader.js:164 Translations loaded for: clock
loader.js:184 Load script: modules/default/calendar/calendar.js
module.js:501 Check MagicMirror version for module 'calendar' - Minimum version:  2.1.0 - Current version: undefined
module.js:525 Uncaught TypeError: Cannot read properties of undefined (reading 'replace')
    at cmpVersions (module.js:525)
    at Function.Module.register (module.js:502)
    at calendar.js:9
loader.js:184 Load script: modules/default/compliments/compliments.js
module.js:509 Module registered: compliments
loader.js:155 Bootstrapping module: compliments
loader.js:244 File already loaded: moment.js
loader.js:160 Scripts loaded for: compliments
loader.js:162 Styles loaded for: compliments
loader.js:164 Translations loaded for: compliments
loader.js:184 Load script: modules/default/weather/weather.js
module.js:509 Module registered: weather
loader.js:155 Bootstrapping module: weather
loader.js:244 File already loaded: moment.js
loader.js:184 Load script: modules/default/weather/weatherprovider.js
loader.js:184 Load script: modules/default/weather/weatherobject.js
loader.js:244 File already loaded: suncalc.js
loader.js:184 Load script: modules/default/weather/providers/openweathermap.js
loader.js:160 Scripts loaded for: weather
loader.js:244 File already loaded: font-awesome.css
loader.js:203 Load stylesheet: vendor/node_modules/weathericons/css/weather-icons.css
loader.js:203 Load stylesheet: modules/default/weather/weather.css
loader.js:162 Styles loaded for: weather
loader.js:164 Translations loaded for: weather
loader.js:184 Load script: modules/MMM-News/MMM-News.js
module.js:509 Module registered: MMM-News
loader.js:155 Bootstrapping module: MMM-News
loader.js:160 Scripts loaded for: MMM-News
loader.js:203 Load stylesheet: modules/MMM-News/MMM-News.css
loader.js:162 Styles loaded for: MMM-News
loader.js:164 Translations loaded for: MMM-News
loader.js:203 Load stylesheet: css/custom.css
alert.js:47 Starting module: alert
updatenotification.js:18 Starting module: updatenotification
clock.js:48 Starting module: clock
compliments.js:38 Starting module: compliments
weatherprovider.js:35 Weather provider: OpenWeatherMap initialized.
weatherprovider.js:46 Weather provider: OpenWeatherMap started.
main.js:499 All modules started!
module.js:94 Template render error: (updatenotification.njk)
  EvalError: Refused to evaluate a string as JavaScript because 'unsafe-eval' is not an allowed source of script in the following Content Security Policy directive: "script-src 'self'".

    at Object.n.t (http://localhost:8080/vendor/node_modules/nunjucks/browser/nunjucks.min.js:2:2630)
    at n.i.render (http://localhost:8080/vendor/node_modules/nunjucks/browser/nunjucks.min.js:2:37638)
    at http://localhost:8080/vendor/node_modules/nunjucks/browser/nunjucks.min.js:2:35783
    at http://localhost:8080/vendor/node_modules/nunjucks/browser/nunjucks.min.js:2:35581
    at o (http://localhost:8080/vendor/node_modules/nunjucks/browser/nunjucks.min.js:2:35306)
    at http://localhost:8080/vendor/node_modules/nunjucks/browser/nunjucks.min.js:2:64086
    at XMLHttpRequest.i.onreadystatechange (http://localhost:8080/vendor/node_modules/nunjucks/browser/nunjucks.min.js:2:64326)
(anonymous) @ module.js:94
module.js:94 Template render error: (current.njk)
  EvalError: Refused to evaluate a string as JavaScript because 'unsafe-eval' is not an allowed source of script in the following Content Security Policy directive: "script-src 'self'".

    at Object.n.t (http://localhost:8080/vendor/node_modules/nunjucks/browser/nunjucks.min.js:2:2630)
    at n.i.render (http://localhost:8080/vendor/node_modules/nunjucks/browser/nunjucks.min.js:2:37638)
    at http://localhost:8080/vendor/node_modules/nunjucks/browser/nunjucks.min.js:2:35783
    at http://localhost:8080/vendor/node_modules/nunjucks/browser/nunjucks.min.js:2:35581
    at o (http://localhost:8080/vendor/node_modules/nunjucks/browser/nunjucks.min.js:2:35306)
    at http://localhost:8080/vendor/node_modules/nunjucks/browser/nunjucks.min.js:2:64086
    at XMLHttpRequest.i.onreadystatechange (http://localhost:8080/vendor/node_modules/nunjucks/browser/nunjucks.min.js:2:64326)
(anonymous) @ module.js:94
weather.js:149 New weather information available.
module.js:94 Template render error: (current.njk)
  EvalError: Refused to evaluate a string as JavaScript because 'unsafe-eval' is not an allowed source of script in the following Content Security Policy directive: "script-src 'self'".

    at Object.n.t (http://localhost:8080/vendor/node_modules/nunjucks/browser/nunjucks.min.js:2:2630)
    at n.i.render (http://localhost:8080/vendor/node_modules/nunjucks/browser/nunjucks.min.js:2:37638)
    at http://localhost:8080/vendor/node_modules/nunjucks/browser/nunjucks.min.js:2:35783
    at http://localhost:8080/vendor/node_modules/nunjucks/browser/nunjucks.min.js:2:35581
    at o (http://localhost:8080/vendor/node_modules/nunjucks/browser/nunjucks.min.js:2:35306)
    at http://localhost:8080/vendor/node_modules/nunjucks/browser/nunjucks.min.js:2:64086
    at XMLHttpRequest.i.onreadystatechange (http://localhost:8080/vendor/node_modules/nunjucks/browser/nunjucks.min.js:2:64326)
(anonymous) @ module.js:94
module.js:94 Template render error: (updatenotification.njk)
  EvalError: Refused to evaluate a string as JavaScript because 'unsafe-eval' is not an allowed source of script in the following Content Security Policy directive: "script-src 'self'".

    at Object.n.t (http://localhost:8080/vendor/node_modules/nunjucks/browser/nunjucks.min.js:2:2630)
    at n.i.render (http://localhost:8080/vendor/node_modules/nunjucks/browser/nunjucks.min.js:2:37638)
    at http://localhost:8080/vendor/node_modules/nunjucks/browser/nunjucks.min.js:2:35783
    at http://localhost:8080/vendor/node_modules/nunjucks/browser/nunjucks.min.js:2:35581
    at o (http://localhost:8080/vendor/node_modules/nunjucks/browser/nunjucks.min.js:2:35306)
    at http://localhost:8080/vendor/node_modules/nunjucks/browser/nunjucks.min.js:2:64086
    at XMLHttpRequest.i.onreadystatechange (http://localhost:8080/vendor/node_modules/nunjucks/browser/nunjucks.min.js:2:64326)

[swvalenti]

Lastly, all the modules I have working on another MM are not showing at all just blank. Is this a windows issue?

[swvalenti]

I scoured the forum and internet but can’t find anything on nunchucks I am guessing that is the issue.

[sdetweil]

@swvalenti did u run the extra steps?? (because the postinstall linux syntax fails on windows)

cd vendor
npm install
cd ..
cd fonts 
npm install
cd ..

now u can start

[sdetweil]

@swvalenti black screen

see https://forum.magicmirror.builders/topic/15778/fix-for-black-screen-in-2-16-and-later