Skip to content
Snippets Groups Projects
Commit 2d7f33ba authored by Thomas Fritsch's avatar Thomas Fritsch
Browse files

modules : maj lien "suivant"

parent 4e9d8db0
No related branches found
No related tags found
No related merge requests found
...@@ -2,7 +2,7 @@ ...@@ -2,7 +2,7 @@
## Sommaire <!-- omit in toc --> ## Sommaire <!-- omit in toc -->
- [C.1. Rappels](#c1-rappels) - [C.1. Rappels](#c1-rappels)
- [C.2. Le support natif des modules dans les navigateurs modernes](#c2-le-support-natif-des-modules-dans-les-navigateurs-modernes) - [C.2. Support natif dans les navigateurs modernes](#c2-support-natif-dans-les-navigateurs-modernes)
- [C.3. Rendre les modules compatibles avec les vieux navigateurs](#c3-rendre-les-modules-compatibles-avec-les-vieux-navigateurs) - [C.3. Rendre les modules compatibles avec les vieux navigateurs](#c3-rendre-les-modules-compatibles-avec-les-vieux-navigateurs)
- [C.4. mode dev vs mode prod](#c4-mode-dev-vs-mode-prod) - [C.4. mode dev vs mode prod](#c4-mode-dev-vs-mode-prod)
- [Étape suivante](#Étape-suivante) - [Étape suivante](#Étape-suivante)
...@@ -33,7 +33,7 @@ Le [support navigateur des modules ES6](https://caniuse.com/#feat=es6-module) es ...@@ -33,7 +33,7 @@ Le [support navigateur des modules ES6](https://caniuse.com/#feat=es6-module) es
Dans un premier temps nous ferons abstraction de ces questions de compatibilité et nous nous appuierons sur le fait que **les dernières versions de Chromium/Chrome et de FireFox supportent nativement les modules ES6**.<br>Nous verrons plus tard dans le TP comment rendre nos modules compatibles avec les vieux navigateurs grâce à Webpack. Dans un premier temps nous ferons abstraction de ces questions de compatibilité et nous nous appuierons sur le fait que **les dernières versions de Chromium/Chrome et de FireFox supportent nativement les modules ES6**.<br>Nous verrons plus tard dans le TP comment rendre nos modules compatibles avec les vieux navigateurs grâce à Webpack.
## C.2. Le support natif des modules dans les navigateurs modernes ## C.2. Support natif dans les navigateurs modernes
1. **Avant d'utiliser le système de modules et les instructions `import`/`export`, il faut d'abord indiquer au navigateur que notre fichier `main.js` est lui-même un module.** Pour cela, ajouter un attribut `type="module"` dans la balise `<script>` du fichier `index.html` : 1. **Avant d'utiliser le système de modules et les instructions `import`/`export`, il faut d'abord indiquer au navigateur que notre fichier `main.js` est lui-même un module.** Pour cela, ajouter un attribut `type="module"` dans la balise `<script>` du fichier `index.html` :
```html ```html
<script type="module" src="build/main.js"></script> <script type="module" src="build/main.js"></script>
...@@ -137,6 +137,7 @@ Vous l'aurez peut-être remarqué, les deux scripts que l'on vient d'ajouter au ...@@ -137,6 +137,7 @@ Vous l'aurez peut-être remarqué, les deux scripts que l'on vient d'ajouter au
1. **Renommez** le fichier `build/main.bundle.js` en `build/main.bundle.dev.js` 1. **Renommez** le fichier `build/main.bundle.js` en `build/main.bundle.dev.js`
2. Stoppez la commande `npm run watch` (<kbd>CTRL</kbd>+<kbd>C</kbd>) et **lancez à la place la commande `npm run build`**. 2. Stoppez la commande `npm run watch` (<kbd>CTRL</kbd>+<kbd>C</kbd>) et **lancez à la place la commande `npm run build`**.
3. **Comparez** le fichier `main.bundle.js` généré avec le mode "production" et le `main.bundle.dev.js` qui avait été généré en mode "development". A votre avis, quelle est l'utilité du mode "production" ? 3. **Comparez** le fichier `main.bundle.js` généré avec le mode "production" et le `main.bundle.dev.js` qui avait été généré en mode "development". A votre avis, quelle est l'utilité du mode "production" ?
4. **Demandez au professeur qui encadre votre séance TP si vous avez vu juste avant de passer à la suite.**
## Étape suivante ## Étape suivante
Maintenant que les modules sont en place, on va. Maintenant que les modules sont en place, on va passer à un peu de POO avancée : [D. POO avancée](D-poo-avancee.md)
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Please register or to comment