Frequently Asked Questions

Deze pagina bevat een overzicht van veel gestelde vragen en een overzicht van de commando's die in de JavaScript vakken gebruikt worden. Alles wat op deze pagina te vinden is, is ook terug te vinden in de lesteksten.

Heb je een suggestie of is er iets wat ontbreekt, dan mag je dit altijd via mail of via de issue tracker laten weten.

Filters

Hoe los ik de foutboodschap "ERR_PNPM_NO_SCRIPT Missing script: dev" op?

Deze foutboodschap wordt getoond als je het commando uitvoerde in een map die geen React project bevat. Zie terminal basics voor meer informatie over hoe je kan navigeren in de terminal.

Elk npm commando moet uitgevoerd worden in de root directory van je project.

Hoe installeer ik een npm library?

Om een nieuwe library te installeren in een project gebruik je onderstaand commando, hier wordt libraryNaam natuurlijk vervangen met de naam van de library die je wil installeren.

pnpm add libraryNaam

Om een library te installeren als development dependency gebruik je het commando

pnpm add -D libraryNaam

Hoe installeer ik een specifieke versie van een npm library?

Om een specifieke versie van een bibliotheek te installeren zoek je op https://www.npmjs.com naar de gewenste versie. Stel je wil versie 17.0.2 van React gebruiken in de plaats van de laatste versie, dan kan je dit op volgende manier toevoegen aan je project:

pnpm add react@17.0.2

pnpm waarschuwt mij dat er kwetsbaarheden gevonden zijn. Moet ik me hier zorgen om maken?

Je mag deze waarschuwingen negeren, in een productieomgeving is dit natuurlijk geen goed idee, maar voor deze cursus ligt de focus op het ontwikkelen van een React applicatie. Dat er hier en daar een verouderde bibliotheek geïnstalleerd is, speelt zo'n rol niet, je code wordt toch niet gebruikt in een productieomgeving.

Hoe start ik een development server voor mijn Vite Project?

Om de development server te starten navigeer je naar de map waarin je project zich bevindt en voer je onderstaand commando uit.

pnpm run dev

Hoe gebruik ik de lesvoorbeelden en oplossingen in de Frontend cursus?

Alle code in deze cursus wordt aangeboden zonder de node_modules map. Dit betekent dat react, react-dom, react-router, react-router-dom, ... niet geïnstalleerd zijn in een gedownload project. Om alle bibliotheken te installeren moet je in elk project dat je download, in de terminal, het onderstaande commando uitvoeren.

pnpm install

Vervolgens kan je het project opstarten met het commando

pnpm dev

Hoe maak ik een nieuw React project aan met Vite?

Een nieuw React project wordt aangemaakt via het commando

pnpm create vite projectNaam --template react-swc-ts

waar projectNaam logischerwijs vervangen wordt met de naam van het nieuwe project. Dit commando produceert een nieuwe map projectNaam die het nieuwe React (Vite) project bevat. Deze map wordt aangemaakt als submap van de locatie waar het commando uitgevoerd wordt. Als de terminal zich, bijvoorbeeld, bevindt in C:\projects, dan zal het commando pnpm create vite projectNaam --template react-swc-ts een nieuwe map C:\projects\projectNaam aanmaken.

Bovenstaand commando genereert enkel de mappenstructuur, maar installeert React en alle andere nodige pakketten nog niet, hiervoor moet je, zoals in de uitvoer in de terminal te zien is, nog 2 extra commando's uitvoeren.

cd projectNaam
pnpm install

Hoe maak ik een productie build van mijn Vite React app?

Om een production build te genereren voor een project gebruik je onderstaand commando. Dit commando produceert een map dist waarvan de inhoud rechtstreeks op webhosting geplaatst kan worden.

pnpm run build

Root URL

Het bovenstaande commando verwacht dat het React project op de root van de webhosting geplaatst wordt, maar dit is natuurlijk niet altijd het geval. Stel je hebt een portfolio waarop je meerdere projecten wil hosten en dat het React project in de map /reactProject zit.

/
|-- index.html
|-- project1
|   |-- index.html
|   |-- ...
|-- reactProject
|   |-- index.html
|   |-- assets
|   |-- ...

In deze situatie moet het pad van het React project meegegeven worden aan het build commando, anders werkt de production build niet, dit doe je als volgt:

pnpm run build --base=/reactProject

Mijn Android emulator start niet op, hoe los ik dit op?

Gebruik het onderstaande commando een cold-boot uit te voeren. Op deze manier wordt alle state verwijderd en wordt de emulator vanaf nul opgestart.

emulator -avd dev -no-snapshot-load