Faire un projet npm, installer webpack, three.js et essayer du 3D!
Ce laboratoire vous permettra de vérifier si vous êtes capable de créer un projet géré par npm et qui utilise une librairie externe.
Étapes
- Initialiser votre projet npm
- Installer
webpack
et webpack-cli
- Ajouter votre fichier
webpack.config.js
(copié d'un autre exercice)
- Ajouter le script "webpack" dans
package.json
- Créer votre dossier
src
et dist
- Placer dans
src
un fichier javascript.js
(main ou bundle, selon le fichier webpack.config.js
) et ajoutez-y un console.log(123)
- Ajouter au fichier index.html un lien votre fichier
javascript.js
du dossier dist
- Installer la librairie 3d three.js :
npm install three
- Essayer l'exemple disponible ici : https://github.com/mrdoob/three.js#usage en y ajoutant le code dans votre fichier
javascript.js
- N'oubliez pas qu'il faut attendre que la page soit chargée avant de commencer à la modifier (ex: append)
- Lorsque ça fonctionnera, la page devrait être noire et avoir un carré qui tourne au centre