You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Copy file name to clipboardExpand all lines: fr/api.md
+6-6
Original file line number
Diff line number
Diff line change
@@ -71,18 +71,18 @@ Voyez l'[Introduction au moteur de dépaquetage](./bundle-renderer.md) et la [Co
71
71
72
72
-`context.state`: (Object) L'état initial du store Vuex devrait être injecté dans la page sous la variable `window.__INITIAL_STATE__`. Le JSON en ligne est automatiquement désinfecté avec [serialize-javascript](https://github.com/yahoo/serialize-javascript) pour éviter les injections XSS.
73
73
74
-
Dans la 2.5.0+, les scripts injectés sont automatiquement retiré en mode production.
74
+
Dans la 2.5.0+, les scripts injectés sont automatiquement retirés en mode production.
75
75
76
76
En plus, quand `clientManifest` est fourni, le modèle de page injecte automatiquement les éléments suivants :
77
77
78
78
- JavaScript client et fichiers CSS nécessaires pour le rendu (avec les fragments asynchrones automatiquement déduits),
79
-
- utilisation optimale des indices de ressources `<link rel="preload/prefetch">` pour le rendu de la page.
79
+
- utilisation optimale des cibles de ressources `<link rel="preload/prefetch">` pour le rendu de la page.
80
80
81
81
Vous pouvez désactiver toutes ces injections en passant `inject: false` au moteur de rendu.
82
82
83
83
Voir également :
84
84
85
-
-[Utiliser un modèle de page](./basic.md#utiliser-un-modele-de-page)
85
+
-[Utiliser un modèle de page](./basic.md#utiliser-un-modèle-de-page)
86
86
-[Injection manuelle des fichiers](./build-config.md#injection-manuelle-des-fichiers)
87
87
88
88
-#### `clientManifest`
@@ -103,7 +103,7 @@ Voyez l'[Introduction au moteur de dépaquetage](./bundle-renderer.md) et la [Co
103
103
104
104
- 2.3.0+
105
105
106
-
Une fonction pour contrôler quels fichiers doivent avoir une ressource d'indice `<link rel="preload">` de générée.
106
+
Une fonction pour contrôler quels fichiers doivent avoir les cibles de ressource `<link rel="preload">` de générées.
107
107
108
108
Par défaut, seuls les fichiers JavaScript et les fichiers CSS seront préchargés, car ils sont absolument nécessaires pour le démarrage de l'application.
109
109
@@ -135,9 +135,9 @@ Voyez l'[Introduction au moteur de dépaquetage](./bundle-renderer.md) et la [Co
135
135
136
136
- 2.5.0+
137
137
138
-
Une fonction pour contrôler quels fichiers devraient avoir l'indice de ressource `<link rel="prefetch">`généré.
138
+
Une fonction pour contrôler quels fichiers devraient avoir la cible de ressource `<link rel="prefetch">`générée.
139
139
140
-
Par défaut, toutes les ressources sont des morceaux asynchrones qui vont être préchargés du fait que se sont des directives de basse priorité. Cependant vous pouvez personnaliser ce qui est préchargé afin d'avoir un meilleur contrôle sur l'utilisation de la bande passante. Cette option utilise une déclaration de fonction identique à celle de `shouldPreload`.
140
+
Par défaut, toutes les ressources sont des morceaux asynchrones qui vont être préchargées du fait que se sont des directives de basse priorité. Cependant vous pouvez personnaliser ce qui est préchargé afin d'avoir un meilleur contrôle sur l'utilisation de la bande passante. Cette option utilise une déclaration de fonction identique à celle de `shouldPreload`.
Copy file name to clipboardExpand all lines: fr/hydration.md
+2
Original file line number
Diff line number
Diff line change
@@ -1,5 +1,7 @@
1
1
# Hydratation côté client
2
2
3
+
L'hydratation fait référence au processus côté client pendant lequel Vue va prendre la main sur le HTML statique envoyé par le serveur et le transformer en un DOM capable de réagir aux changements réactifs des données côté client.
4
+
3
5
Dans `entry-client.js`, nous montons simplement l'application avec cette ligne :
Copy file name to clipboardExpand all lines: fr/routing.md
+2-2
Original file line number
Diff line number
Diff line change
@@ -119,9 +119,9 @@ import Foo from './Foo.vue'
119
119
constFoo= () =>import('./Foo.vue')
120
120
```
121
121
122
-
Cela fonctionnera dans n'importe quel scénario si vous êtes en train de faire une application Vue uniquement pour le côté client. Toutefois, il y aura certaines limitations en l'utilisant avec du SSR. Premièrement, il faut résoudre tous les composants asynchrones à l'avance sur le serveur avant de faire le rendu, car sinon il y aura juste un emplacement vide dans le code HTML. Pour le côté client, il faut aussi faire cela avant de commencer l'hydratation des données, sinon il y aurait des erreurs d'incompatibilités sur le contenu.
122
+
Jusqu'en Vue 2.5, cela fonctionnait pour les composants au niveau des routes. Cependant, avec les améliorations des algorithmes en 2.5+, cela fonctionne maintenant parfaitement partout dans votre application.
123
123
124
-
Tout cela rend un peu compliquée l'utilisation des composants asynchrones à des endroits spécifiques dans votre application (nous allons probablement améliorer cela dans le futur). Toutefois, **cela fonctionne parfaitement si vous le faites au niveau de la route** - c.-à-d. d'utiliser les composants asynchrones dans la configuration des routes - car `vue-router` ira automatiquement résoudre les composants asynchrones nécessaires au bon fonctionnement de la route. Vous devez être sûr d'utiliser `router.onReady` sur le serveur et le client. Nous l'avons déjà fait pour le fichier d'entrée du serveur, il ne nous reste plus maintenant qu'à faire de même pour le fichier d'entrée du client :
124
+
Notez qu'il est toujours nécessaire d'utiliser `router.onReady` côté client et côté serveur avant le renvoi / le montage de l'application, car le routeur doit résoudre les composants de route asynchrones à l'avance pour correctement déclencher les hooks des composants. Nous avons déjà fait cela dans notre entrée serveur et maintenant nous allons faire de même pour l'entrée cliente :
Copy file name to clipboardExpand all lines: fr/universal.md
+1-1
Original file line number
Diff line number
Diff line change
@@ -18,7 +18,7 @@ Une autre chose à noter est que vous devriez éviter la création d'effets de b
18
18
19
19
Le code universel ne peut pas accéder aux APIs spécifiques à une plateforme. Ainsi, si votre code utilise directement les variables globales exclusives au navigateur comme `window` ou `document`, elles lèveront des erreurs si elles sont exécutées sur Node.js, et vice-versa.
20
20
21
-
Pour les tâches partagées entre le serveur et le client, mais qui utilisent des APIs différentes selon la plateforme, il est recommandé d'encapsuler le code spécifique à la plateforme dans une API universelle, ou d'utiliser des bibliothèques qui le font pour vous. Par exemple, [axios](https://github.com/mzabriskie/axios) est un client HTTP qui présente la même API côté serveur et côté client.
21
+
Pour les tâches partagées entre le serveur et le client, mais qui utilisent des APIs différentes selon la plateforme, il est recommandé d'encapsuler le code spécifique à la plateforme dans une API universelle, ou d'utiliser des bibliothèques qui le font pour vous. Par exemple, [axios](https://github.com/axios/axios) est un client HTTP qui présente la même API côté serveur et côté client.
22
22
23
23
Pour les APIs exclusives au navigateur, l'approche habituelle est de les utiliser dans les hooks de cycle de vie exclusifs au client.
0 commit comments