From 0e3e701dd28b155fab34076feabfa46eb185eab4 Mon Sep 17 00:00:00 2001 From: Bruno Lesieur Date: Fri, 5 May 2017 14:08:03 +0200 Subject: [PATCH 01/90] Add working branch Signed-off-by: Bruno Lesieur --- README.md | 64 +++++++++++-------------------------------------------- 1 file changed, 13 insertions(+), 51 deletions(-) diff --git a/README.md b/README.md index 59506dadc..c4adcba9d 100644 --- a/README.md +++ b/README.md @@ -1,65 +1,27 @@ # vue-router [![Build Status](https://img.shields.io/circleci/project/vuejs/vue-router/dev.svg)](https://circleci.com/gh/vuejs/vue-router) -> This is vue-router 2.0 which works only with Vue 2.0. For the 1.x router see the [1.0 branch](https://github.com/vuejs/vue-router/tree/1.0). -### Introduction +### Traduction -`vue-router` is the official router for [Vue.js](http://vuejs.org). It deeply integrates with Vue.js core to make building Single Page Applications with Vue.js a breeze. Features include: +Cette branche de travail `working` est volontairement mise en avant et doit uniquement être mise à jour dans le sens : -- Nested route/view mapping -- Modular, component-based router configuration -- Route params, query, wildcards -- View transition effects powered by Vue.js' transition system -- Fine-grained navigation control -- Links with automatic active CSS classes -- HTML5 history mode or hash mode, with auto-fallback in IE9 -- Customizable Scroll Behavior +`vuejs/vuejs-fr/vue-router:dev` --> `vuejs-fr/vue-router:working`. -Get started with the [documentation](http://vuejs.github.io/vue-router), or play with the [examples](https://github.com/vuejs/vue-router/tree/dev/examples) (see how to run them below). +Nous traduisons les fichiers directement dans le dossier `docs/en` sans les renommer. Cela permet lors de la mise à jour de la documentation via l'utilisation des commandes : -### Development Setup - -``` bash -# install deps -npm install - -# build dist files -npm run build - -# serve examples at localhost:8080 -npm run dev - -# lint & run all tests -npm test - -# serve docs at localhost:4000 (requires global gitbook-cli) -npm run docs +``` +git fetch upstream +git merge upstream/master ``` -## Questions - -For questions and support please use the [Gitter chat room](https://gitter.im/vuejs/vue) or [the official forum](http://forum.vuejs.org). The issue list of this repo is **exclusively** for bug reports and feature requests. - -## Issues - -Please make sure to read the [Issue Reporting Checklist](https://github.com/vuejs/vue/blob/dev/.github/CONTRIBUTING.md#issue-reporting-guidelines) before opening an issue. Issues not conforming to the guidelines may be closed immediately. - -## Contribution - -Please make sure to read the [Contributing Guide](https://github.com/vuejs/vue/blob/dev/.github/CONTRIBUTING.md) before making a pull request. - -## Changelog - -Details changes for each release are documented in the [release notes](https://github.com/vuejs/vue-router/releases). - -## Stay In Touch - -- For latest releases and announcements, follow on Twitter: [@vuejs](https://twitter.com/vuejs) +d'obtenir des conflits **sur les pages déjà traduites** et ainsi maintenir la documentation à jour en fonction des modifications à travers **les documents déjà traduits**. -## License +### Reverssement -[MIT](http://opensource.org/licenses/MIT) +Quand un fichier traduit est validé par pull request, on le met à jour dans le dossier `docs/fr` de `vuejs-fr/vue-router:dev` puis on propose une pull request au site principal : -Copyright (c) 2013-2016 Evan You +`vuejs-fr/vue-router:dev` --> `vuejs/vue-router:dev` +ainsi le dossier officiel hébergeant la documentation possède bien le dossier `docs/fr` en français et le dossier `docs/en` en anglais. +Note : il peut être intéressant de faire une pull request par ficher validé et donc de créer une branche dérivée de `vuejs-fr/vue-router:dev` pour faire la pull request (`vuejs-fr/vue-router:dev` --> `vuejs-fr/vue-router:only_one_changed_file_from_master` --> `vuejs/vue-router:dev`) From 3324b60e96a76b147d6a18ba34ae24359ce87299 Mon Sep 17 00:00:00 2001 From: Bruno Lesieur Date: Fri, 5 May 2017 14:33:12 +0200 Subject: [PATCH 02/90] Prepare all files for translastion Signed-off-by: Bruno Lesieur --- docs/en/SUMMARY.md | 54 ++++++++++++------------ docs/en/advanced/data-fetching.md | 2 +- docs/en/advanced/lazy-loading.md | 2 +- docs/en/advanced/meta.md | 2 +- docs/en/advanced/navigation-guards.md | 2 +- docs/en/advanced/scroll-behavior.md | 2 +- docs/en/advanced/transitions.md | 2 +- docs/en/api/component-injections.md | 2 +- docs/en/api/options.md | 2 +- docs/en/api/route-object.md | 2 +- docs/en/api/router-instance.md | 2 +- docs/en/api/router-link.md | 2 +- docs/en/api/router-view.md | 2 +- docs/en/essentials/dynamic-matching.md | 2 +- docs/en/essentials/getting-started.md | 2 +- docs/en/essentials/history-mode.md | 2 +- docs/en/essentials/named-routes.md | 2 +- docs/en/essentials/named-views.md | 2 +- docs/en/essentials/navigation.md | 2 +- docs/en/essentials/nested-routes.md | 2 +- docs/en/essentials/passing-props.md | 2 +- docs/en/essentials/redirect-and-alias.md | 2 +- docs/en/installation.md | 2 +- 23 files changed, 49 insertions(+), 49 deletions(-) diff --git a/docs/en/SUMMARY.md b/docs/en/SUMMARY.md index ef2e68846..6f34288c7 100644 --- a/docs/en/SUMMARY.md +++ b/docs/en/SUMMARY.md @@ -1,31 +1,31 @@ # vue-router 2 -> Note: vue-router@2.x only works with Vue 2.x. Docs for 0.7.x is [here](https://github.com/vuejs/vue-router/tree/1.0/docs/en). +> Note: vue-router@2.x fonctionne uniquement avec Vue 2.x. La doc pour la 0.7.x est [ici](https://github.com/vuejs/vue-router/tree/1.0/docs/en). -**[Release Notes](https://github.com/vuejs/vue-router/releases)** +**[Notes de release](https://github.com/vuejs/vue-router/releases)** -- [Installation](installation.md) -- Essentials - - [Getting Started](essentials/getting-started.md) - - [Dynamic Route Matching](essentials/dynamic-matching.md) - - [Nested Routes](essentials/nested-routes.md) - - [Programmatic Navigation](essentials/navigation.md) - - [Named Routes](essentials/named-routes.md) - - [Named Views](essentials/named-views.md) - - [Redirect and Alias](essentials/redirect-and-alias.md) - - [Passing Props to Route Components](essentials/passing-props.md) - - [HTML5 History Mode](essentials/history-mode.md) -- Advanced - - [Navigation Guards](advanced/navigation-guards.md) - - [Route Meta Fields](advanced/meta.md) - - [Transitions](advanced/transitions.md) - - [Data Fetching](advanced/data-fetching.md) - - [Scroll Behavior](advanced/scroll-behavior.md) - - [Lazy Loading](advanced/lazy-loading.md) -- API Reference - - [router-link](api/router-link.md) - - [router-view](api/router-view.md) - - [The Route Object](api/route-object.md) - - [Router Constructor Options](api/options.md) - - [Router Instance](api/router-instance.md) - - [Component Injections](api/component-injections.md) +- [Installation (En)](installation.md) +- Essentiel + - [Pour commencer (En)](essentials/getting-started.md) + - [Dynamic Route Matching (En)](essentials/dynamic-matching.md) + - [Nested Routes (En)](essentials/nested-routes.md) + - [Programmatic Navigation (En)](essentials/navigation.md) + - [Named Routes (En)](essentials/named-routes.md) + - [Named Views (En)](essentials/named-views.md) + - [Redirect and Alias (En)](essentials/redirect-and-alias.md) + - [Passing Props to Route Components (En)](essentials/passing-props.md) + - [HTML5 History Mode (En)](essentials/history-mode.md) +- Avancé + - [Navigation Guards (En)](advanced/navigation-guards.md) + - [Route Meta Fields (En)](advanced/meta.md) + - [Transitions (En)](advanced/transitions.md) + - [Data Fetching (En)](advanced/data-fetching.md) + - [Scroll Behavior (En)](advanced/scroll-behavior.md) + - [Lazy Loading (En)](advanced/lazy-loading.md) +- Réference de l'API + - [router-link (En)](api/router-link.md) + - [router-view (En)](api/router-view.md) + - [The Route Object (En)](api/route-object.md) + - [Router Constructor Options (En)](api/options.md) + - [Router Instance (En)](api/router-instance.md) + - [Component Injections (En)](api/component-injections.md) diff --git a/docs/en/advanced/data-fetching.md b/docs/en/advanced/data-fetching.md index 1bd472153..c3255de23 100644 --- a/docs/en/advanced/data-fetching.md +++ b/docs/en/advanced/data-fetching.md @@ -1,4 +1,4 @@ -# Data Fetching +# Data Fetching (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-ssr-docs).* Sometimes you need to fetch data from the server when a route is activated. For example, before rendering a user profile, you need to fetch the user's data from the server. We can achieve this in two different ways: diff --git a/docs/en/advanced/lazy-loading.md b/docs/en/advanced/lazy-loading.md index 949e9d912..d4366cbf1 100644 --- a/docs/en/advanced/lazy-loading.md +++ b/docs/en/advanced/lazy-loading.md @@ -1,4 +1,4 @@ -# Lazy Loading Routes +# Lazy Loading Routes (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-ssr-docs).* When building apps with a bundler, the JavaScript bundle can become quite large, and thus affect the page load time. It would be more efficient if we can split each route's components into a separate chunk, and only load them when the route is visited. diff --git a/docs/en/advanced/meta.md b/docs/en/advanced/meta.md index 79845b28d..4203a0ef2 100644 --- a/docs/en/advanced/meta.md +++ b/docs/en/advanced/meta.md @@ -1,4 +1,4 @@ -# Route Meta Fields +# Route Meta Fields (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-ssr-docs).* You can include a `meta` field when defining a route: diff --git a/docs/en/advanced/navigation-guards.md b/docs/en/advanced/navigation-guards.md index 8ff4cc730..e385a1fc9 100644 --- a/docs/en/advanced/navigation-guards.md +++ b/docs/en/advanced/navigation-guards.md @@ -1,4 +1,4 @@ -# Navigation Guards +# Navigation Guards (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-ssr-docs).* As the name suggests, the navigation guards provided by `vue-router` are primarily used to guard navigations either by redirecting it or canceling it. There are a number of ways to hook into the route navigation process: globally, per-route, or in-component. diff --git a/docs/en/advanced/scroll-behavior.md b/docs/en/advanced/scroll-behavior.md index 46c511442..c075c2972 100644 --- a/docs/en/advanced/scroll-behavior.md +++ b/docs/en/advanced/scroll-behavior.md @@ -1,4 +1,4 @@ -# Scroll Behavior +# Scroll Behavior (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-ssr-docs).* When using client-side routing, we may want to scroll to top when navigating to a new route, or preserve the scrolling position of history entries just like real page reload does. `vue-router` allows you to achieve these and even better, allows you to completely customize the scroll behavior on route navigation. diff --git a/docs/en/advanced/transitions.md b/docs/en/advanced/transitions.md index d6595b23b..68e35b976 100644 --- a/docs/en/advanced/transitions.md +++ b/docs/en/advanced/transitions.md @@ -1,4 +1,4 @@ -# Transitions +# Transitions (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-ssr-docs).* Since the `` is essentially a dynamic component, we can apply transition effects to it the same way using the `` component: diff --git a/docs/en/api/component-injections.md b/docs/en/api/component-injections.md index f07715cfc..6cb8391c8 100644 --- a/docs/en/api/component-injections.md +++ b/docs/en/api/component-injections.md @@ -1,4 +1,4 @@ -# Component Injections +# Component Injections (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-ssr-docs).* ### Injected Properties diff --git a/docs/en/api/options.md b/docs/en/api/options.md index be4031418..0264c2c5f 100644 --- a/docs/en/api/options.md +++ b/docs/en/api/options.md @@ -1,4 +1,4 @@ -# Router Construction Options +# Router Construction Options (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-ssr-docs).* ### routes diff --git a/docs/en/api/route-object.md b/docs/en/api/route-object.md index 61590f724..00578dd2c 100644 --- a/docs/en/api/route-object.md +++ b/docs/en/api/route-object.md @@ -1,4 +1,4 @@ -# The Route Object +# The Route Object (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-ssr-docs).* A **route object** represents the state of the current active route. It contains parsed information of the current URL and the **route records** matched by the URL. diff --git a/docs/en/api/router-instance.md b/docs/en/api/router-instance.md index 9e6f9b665..a4e69259e 100644 --- a/docs/en/api/router-instance.md +++ b/docs/en/api/router-instance.md @@ -1,4 +1,4 @@ -# Router Instance +# Router Instance (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-ssr-docs).* ### Properties diff --git a/docs/en/api/router-link.md b/docs/en/api/router-link.md index 7cd5ce4bb..729b7d634 100644 --- a/docs/en/api/router-link.md +++ b/docs/en/api/router-link.md @@ -1,4 +1,4 @@ -# `` +# `` (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-ssr-docs).* `` is the component for enabling user navigation in a router-enabled app. The target location is specified with the `to` prop. It renders as an `` tag with correct `href` by default, but can be configured with the `tag` prop. In addition, the link automatically gets an active CSS class when the target route is active. diff --git a/docs/en/api/router-view.md b/docs/en/api/router-view.md index 7e504f6ea..a099a197f 100644 --- a/docs/en/api/router-view.md +++ b/docs/en/api/router-view.md @@ -1,4 +1,4 @@ -# `` +# `` (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-ssr-docs).* The `` component is a functional component that renders the matched component for the given path. Components rendered in `` can also contain its own ``, which will render components for nested paths. diff --git a/docs/en/essentials/dynamic-matching.md b/docs/en/essentials/dynamic-matching.md index 6107b5f9a..933ab86b7 100644 --- a/docs/en/essentials/dynamic-matching.md +++ b/docs/en/essentials/dynamic-matching.md @@ -1,4 +1,4 @@ -# Dynamic Route Matching +# Dynamic Route Matching (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-ssr-docs).* Very often we will need to map routes with the given pattern to the same component. For example we may have a `User` component which should be rendered for all users but with different user IDs. In `vue-router` we can use a dynamic segment in the path to achieve that: diff --git a/docs/en/essentials/getting-started.md b/docs/en/essentials/getting-started.md index 95c70e7f3..dcbf5d068 100644 --- a/docs/en/essentials/getting-started.md +++ b/docs/en/essentials/getting-started.md @@ -1,4 +1,4 @@ -# Getting Started +# Getting Started (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-ssr-docs).* > We will be using [ES2015](https://github.com/lukehoban/es6features) in the code samples in the guide. diff --git a/docs/en/essentials/history-mode.md b/docs/en/essentials/history-mode.md index 56c55ffdc..853902e11 100644 --- a/docs/en/essentials/history-mode.md +++ b/docs/en/essentials/history-mode.md @@ -1,4 +1,4 @@ -# HTML5 History Mode +# HTML5 History Mode (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-ssr-docs).* The default mode for `vue-router` is _hash mode_ - it uses the URL hash to simulate a full URL so that the page won't be reloaded when the URL changes. diff --git a/docs/en/essentials/named-routes.md b/docs/en/essentials/named-routes.md index 2c8359736..b2a830f36 100644 --- a/docs/en/essentials/named-routes.md +++ b/docs/en/essentials/named-routes.md @@ -1,4 +1,4 @@ -# Named Routes +# Named Routes (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-ssr-docs).* Sometimes it is more convenient to identify a route with a name, especially when linking to a route or performing navigations. You can give a route a name in the `routes` options while creating the Router instance: diff --git a/docs/en/essentials/named-views.md b/docs/en/essentials/named-views.md index 0b9639222..a690fb90f 100644 --- a/docs/en/essentials/named-views.md +++ b/docs/en/essentials/named-views.md @@ -1,4 +1,4 @@ -# Named Views +# Named Views (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-ssr-docs).* Sometimes you need to display multiple views at the same time instead of nesting them, e.g. creating a layout with a `sidebar` view and a `main` view. This is where named views came in handy. Instead of having one single outlet in your view, you can have multiple and give each of them a name. A `router-view` without a name will be given `default` as its name. diff --git a/docs/en/essentials/navigation.md b/docs/en/essentials/navigation.md index d2a08eb99..7879b7569 100644 --- a/docs/en/essentials/navigation.md +++ b/docs/en/essentials/navigation.md @@ -1,4 +1,4 @@ -# Programmatic Navigation +# Programmatic Navigation (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-ssr-docs).* Aside from using `` to create anchor tags for declarative navigation, we can do this programmatically using the router's instance methods. diff --git a/docs/en/essentials/nested-routes.md b/docs/en/essentials/nested-routes.md index 35241f0f4..4e535be89 100644 --- a/docs/en/essentials/nested-routes.md +++ b/docs/en/essentials/nested-routes.md @@ -1,4 +1,4 @@ -# Nested Routes +# Nested Routes (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-ssr-docs).* Real app UIs are usually composed of components that are nested multiple levels deep. It is also very common that the segments of a URL corresponds to a certain structure of nested components, for example: diff --git a/docs/en/essentials/passing-props.md b/docs/en/essentials/passing-props.md index c50483d9d..4ab35110f 100644 --- a/docs/en/essentials/passing-props.md +++ b/docs/en/essentials/passing-props.md @@ -1,4 +1,4 @@ -# Passing Props to Route Components +# Passing Props to Route Components (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-ssr-docs).* Using `$route` in your component creates a tight coupling with the route which limits the flexibility of the component as it can only be used on certain urls. diff --git a/docs/en/essentials/redirect-and-alias.md b/docs/en/essentials/redirect-and-alias.md index b23aa95d7..f963595bf 100644 --- a/docs/en/essentials/redirect-and-alias.md +++ b/docs/en/essentials/redirect-and-alias.md @@ -1,4 +1,4 @@ -# Redirect and Alias +# Redirect and Alias (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-ssr-docs).* ### Redirect diff --git a/docs/en/installation.md b/docs/en/installation.md index b22fba8d4..785846cf0 100644 --- a/docs/en/installation.md +++ b/docs/en/installation.md @@ -1,4 +1,4 @@ -# Installation +# Installation (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-ssr-docs).* ### Direct Download / CDN From 0641f593488b376788d19d2d99045015f9930d97 Mon Sep 17 00:00:00 2001 From: Bruno Lesieur Date: Fri, 5 May 2017 14:42:51 +0200 Subject: [PATCH 03/90] Update website Signed-off-by: Bruno Lesieur --- README.md | 56 ++++++++++++++++++++++++++++++++++++++++--------------- 1 file changed, 41 insertions(+), 15 deletions(-) diff --git a/README.md b/README.md index c4adcba9d..212be5119 100644 --- a/README.md +++ b/README.md @@ -1,27 +1,53 @@ -# vue-router [![Build Status](https://img.shields.io/circleci/project/vuejs/vue-router/dev.svg)](https://circleci.com/gh/vuejs/vue-router) +# Comment faire ? # +- [Pour savoir ce qu'il reste à traduire c'est par ici](https://github.com/vuejs-fr/vue-router/issues/1) -### Traduction +Pour tous ceux qui souhaitent traduire les page de la doc officielle en français : -Cette branche de travail `working` est volontairement mise en avant et doit uniquement être mise à jour dans le sens : +## Conseils ## -`vuejs/vuejs-fr/vue-router:dev` --> `vuejs-fr/vue-router:working`. +> Si vous avez **beaucoup de temps** à consacrer à cette tâche par jour, **traduisez les premières pages** du guide. +> Si vous avez **peu de temps** à consacrer à cette tâche par jour, **traduisez des pages plus éloignées** dans le guide, ou les pages des autres dossiers. -Nous traduisons les fichiers directement dans le dossier `docs/en` sans les renommer. Cela permet lors de la mise à jour de la documentation via l'utilisation des commandes : -``` -git fetch upstream -git merge upstream/master -``` +### Important ### -d'obtenir des conflits **sur les pages déjà traduites** et ainsi maintenir la documentation à jour en fonction des modifications à travers **les documents déjà traduits**. +Il faut conserver le même nombre de lignes entre le fichier original et le fichier traduit et s'assurer que chaque numéro de ligne original corresponde à son numéro de ligne traduit. Cela nous permettra de suivre plus facilement les pans de texte qui ont changés dans le futur ou même d'avoir version EN/FR en concordance dans nos pulls request ligne par ligne — ce qui est plus pratique pour les reviews. -### Reverssement +## Étapes ## -Quand un fichier traduit est validé par pull request, on le met à jour dans le dossier `docs/fr` de `vuejs-fr/vue-router:dev` puis on propose une pull request au site principal : +### 1. Informer -`vuejs-fr/vue-router:dev` --> `vuejs/vue-router:dev` +Dites ici que vous allez entreprendre la traduction d'une page. Éditez le premier post et changez l'état de la liste si vous en avez le droit. -ainsi le dossier officiel hébergeant la documentation possède bien le dossier `docs/fr` en français et le dossier `docs/en` en anglais. +### 2. Faire un fork -Note : il peut être intéressant de faire une pull request par ficher validé et donc de créer une branche dérivée de `vuejs-fr/vue-router:dev` pour faire la pull request (`vuejs-fr/vue-router:dev` --> `vuejs-fr/vue-router:only_one_changed_file_from_master` --> `vuejs/vue-router:dev`) +Faites un fork du dépôt `vuejs-fr/vue-router:working` (ce dépôt) vers `{your-username}/vuejs.org:working` (chez vous). + +### 3. Créer une branche + +Créez une nouvelle branche {branch} dédiée spécifiquement au changement de votre fichier. + +#### 4. Débuter la traduction + +Commencez à traduire votre fichier directement depuis `en` pour pouvoir effectuer au moins un premier commit. + +#### 5. Demander de l'aide + +Faites une pull request depuis votre branche de fork `{your-username}/vue-router:{branch}` vers notre branche de dépôt `vuejs-fr/vue-router:working` pour que tout le monde puisse garder un œil sur l'avancée de votre traduction et que vous puissiez éventuellement demander des conseils. Assignez (*assignees*) vous cette pull request. + +#### 6. Réclamer des reviews + +Quand votre traduction est assez mûr pour une review, affectez des personnes en tant que reviewer (probablement celles qui vous auront aidé lors de la traduction) pour qu'elles sachent qu'elles peuvent consacrer un temps plus conséquent à la relecture minutieuse de votre travail. + +#### 7. Itérez les ajustements + +De la même manière qu'avant review votre traduction a été mis à jour au fur et à mesure de vos commits sur la pull request ; vous mettez à jour maintenant les remarques de review pour solidifier votre travail toujours avec des commits. Au moins 3 relecteurs sont recommandés. + +#### 8. Merger + +Une fois tout en ordre et que toutes les reviews sont approuvées vous pouvez merger votre travail. Il sera ensuite reverser sur la branche `vuejs-fr/vue-router:dev` dans le dossier `fr` et proposer en pull request au repository officiel `vuejs/vue-router:dev`. + +## Voir le résultat sur le site https://router.vuejs.org/fr/ + +La monter en production n'est pas de notre ressort, soyez patient ! \ No newline at end of file From e13d90f025833f1a03cddd92852d8285e5ba1f8b Mon Sep 17 00:00:00 2001 From: Bruno Lesieur Date: Fri, 5 May 2017 16:27:18 +0200 Subject: [PATCH 04/90] Readme d'introduction avec lien --- README.md | 57 +++++++++++++++++-------------------------------------- 1 file changed, 17 insertions(+), 40 deletions(-) diff --git a/README.md b/README.md index 212be5119..ae23c14aa 100644 --- a/README.md +++ b/README.md @@ -1,53 +1,30 @@ -# Comment faire ? # +# Pour traduire la documentation de vue-router -- [Pour savoir ce qu'il reste à traduire c'est par ici](https://github.com/vuejs-fr/vue-router/issues/1) +### Workflow de travail -Pour tous ceux qui souhaitent traduire les page de la doc officielle en français : +Cette branche de travail `working` est volontairement mise en avant et doit uniquement être mise à jour dans le sens : -## Conseils ## +`vuejs/vue-router:dev` --> `vuejs-fr/vue-router:working`. -> Si vous avez **beaucoup de temps** à consacrer à cette tâche par jour, **traduisez les premières pages** du guide. -> Si vous avez **peu de temps** à consacrer à cette tâche par jour, **traduisez des pages plus éloignées** dans le guide, ou les pages des autres dossiers. +Nous traduisons les fichiers directement dans le dossier `en` sans les renommer. Cela permet lors de la mise à jour de la documentation via l'utilisation des commandes : +``` +git fetch upstream +git merge upstream/master +``` -### Important ### +d'obtenir des conflits **sur les pages déjà traduites** et ainsi maintenir la documentation à jour en fonction des modifications à travers **les documents déjà traduits**. -Il faut conserver le même nombre de lignes entre le fichier original et le fichier traduit et s'assurer que chaque numéro de ligne original corresponde à son numéro de ligne traduit. Cela nous permettra de suivre plus facilement les pans de texte qui ont changés dans le futur ou même d'avoir version EN/FR en concordance dans nos pulls request ligne par ligne — ce qui est plus pratique pour les reviews. +### Traduction -## Étapes ## +Pour savoir ce qui est [en cours de traduction](https://github.com/vuejs-fr/vue-router/issues/1) ou [comment traduire un fichier](https://github.com/vuejs-fr/vue-router/issues/2), référez vous aux issues correspondantes. -### 1. Informer +### Reverssement -Dites ici que vous allez entreprendre la traduction d'une page. Éditez le premier post et changez l'état de la liste si vous en avez le droit. +Quand un fichier traduit est validé par pull request, on le met à jour dans le dossier `fr` de `vuejs-fr/vue-router:dev` puis on propose une pull request au site principal : -### 2. Faire un fork +`vuejs-fr/vue-router:dev` --> `vuejs/vue-router:dev` -Faites un fork du dépôt `vuejs-fr/vue-router:working` (ce dépôt) vers `{your-username}/vuejs.org:working` (chez vous). +ainsi le dossier officiel hébergeant la documentation possède bien le dossier `fr` en français et le dossier `en` en anglais. -### 3. Créer une branche - -Créez une nouvelle branche {branch} dédiée spécifiquement au changement de votre fichier. - -#### 4. Débuter la traduction - -Commencez à traduire votre fichier directement depuis `en` pour pouvoir effectuer au moins un premier commit. - -#### 5. Demander de l'aide - -Faites une pull request depuis votre branche de fork `{your-username}/vue-router:{branch}` vers notre branche de dépôt `vuejs-fr/vue-router:working` pour que tout le monde puisse garder un œil sur l'avancée de votre traduction et que vous puissiez éventuellement demander des conseils. Assignez (*assignees*) vous cette pull request. - -#### 6. Réclamer des reviews - -Quand votre traduction est assez mûr pour une review, affectez des personnes en tant que reviewer (probablement celles qui vous auront aidé lors de la traduction) pour qu'elles sachent qu'elles peuvent consacrer un temps plus conséquent à la relecture minutieuse de votre travail. - -#### 7. Itérez les ajustements - -De la même manière qu'avant review votre traduction a été mis à jour au fur et à mesure de vos commits sur la pull request ; vous mettez à jour maintenant les remarques de review pour solidifier votre travail toujours avec des commits. Au moins 3 relecteurs sont recommandés. - -#### 8. Merger - -Une fois tout en ordre et que toutes les reviews sont approuvées vous pouvez merger votre travail. Il sera ensuite reverser sur la branche `vuejs-fr/vue-router:dev` dans le dossier `fr` et proposer en pull request au repository officiel `vuejs/vue-router:dev`. - -## Voir le résultat sur le site https://router.vuejs.org/fr/ - -La monter en production n'est pas de notre ressort, soyez patient ! \ No newline at end of file +Note : il peut être intéressant de faire une pull request par ficher validé et donc de créer une branche dérivée de `vuejs-fr/vue-router:dev` pour faire la pull request (`vuejs-fr/vue-router:dev` --> `vuejs-fr/vue-router:only_one_changed_file_from_master` --> `vuejs/vue-router:dev`) From 75e366d0afa6553577f90e6422924242ad91275c Mon Sep 17 00:00:00 2001 From: Hugo Alliaume Date: Fri, 5 May 2017 22:07:18 +0200 Subject: [PATCH 05/90] Add translation for `installation.md` --- docs/en/SUMMARY.md | 2 +- docs/en/installation.md | 15 +++++++-------- 2 files changed, 8 insertions(+), 9 deletions(-) diff --git a/docs/en/SUMMARY.md b/docs/en/SUMMARY.md index 6f34288c7..16afdc856 100644 --- a/docs/en/SUMMARY.md +++ b/docs/en/SUMMARY.md @@ -6,7 +6,7 @@ - [Installation (En)](installation.md) - Essentiel - - [Pour commencer (En)](essentials/getting-started.md) + - [Pour commencer](essentials/getting-started.md) - [Dynamic Route Matching (En)](essentials/dynamic-matching.md) - [Nested Routes (En)](essentials/nested-routes.md) - [Programmatic Navigation (En)](essentials/navigation.md) diff --git a/docs/en/installation.md b/docs/en/installation.md index 785846cf0..c63e4cbae 100644 --- a/docs/en/installation.md +++ b/docs/en/installation.md @@ -1,14 +1,14 @@ -# Installation (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-ssr-docs).* +# Installation -### Direct Download / CDN +### Téléchargement direct / CDN [https://unpkg.com/vue-router/dist/vue-router.js](https://unpkg.com/vue-router/dist/vue-router.js) -[Unpkg.com](https://unpkg.com) provides NPM-based CDN links. The above link will always point to the latest release on NPM. You can also use a specific version/tag via URLs like `https://unpkg.com/vue-router@2.0.0/dist/vue-router.js`. +[Unpkg.com](https://unpkg.com) met à disposition des liens CDN basés sur NPM. Le lien ci-dessus pointera toujours vers la dernière release publiée sur NPM. Vous pouvez également spécifier une certain-e version/tag via l'URL comme `https://unpkg.com/vue-router@2.0.0/dist/vue-router.js`. -Include `vue-router` after Vue and it will install itself automatically: +Inclure `vue-router` après Vue, et il s'installera automatiquement de lui-même : ``` html @@ -21,7 +21,7 @@ Include `vue-router` after Vue and it will install itself automatically: npm install vue-router ``` -When used with a module system, you must explicitly install the router via `Vue.use()`: +Lorsqu'il est utilisé avec un système de module, vous devez explicitement installer le router via `Vue.use()` : ``` js import Vue from 'vue' @@ -30,12 +30,11 @@ import VueRouter from 'vue-router' Vue.use(VueRouter) ``` -You don't need to do this when using global script tags. +Vous n'avez pas besoin de faire cela lors de l'utilisation des tags ` @@ -30,11 +30,11 @@ import VueRouter from 'vue-router' Vue.use(VueRouter) ``` -Vous n'avez pas besoin de faire cela lors de l'utilisation des tags `
-

Hello App!

+

Bonjour l'application !

- - - - Go to Foo - Go to Bar + + + + Aller à Foo + Aller à Bar

- - + +
``` @@ -30,33 +30,33 @@ Creating a Single-page Application with Vue.js + vue-router is dead simple. With ### JavaScript ``` js -// 0. If using a module system (e.g. via vue-cli), import Vue and VueRouter and then call Vue.use(VueRouter). +// 0. Si vous utilisez un système de modules (e.g. via vue-cli), il faut importer Vue et VueRouter et ensuite appeler Vue.use(VueRouter). -// 1. Define route components. -// These can be imported from other files +// 1. Définir des composants. +// Ces derniers peuvent être importés depuis d'autre fichier const Foo = { template: '
foo
' } const Bar = { template: '
bar
' } -// 2. Define some routes -// Each route should map to a component. The "component" can -// either be an actual component constructor created via -// Vue.extend(), or just a component options object. -// We'll talk about nested routes later. +// 2. Définir des routes. +// Chaque route doit corresponde à un composant. Le "composant" peut +// soit être un véritable composant créé via Vue.extend(), ou juste un +// objet d'options. +// Nous parlerons plus tard des routes imbriquées. const routes = [ { path: '/foo', component: Foo }, { path: '/bar', component: Bar } ] -// 3. Create the router instance and pass the `routes` option -// You can pass in additional options here, but let's -// keep it simple for now. +// 3. Créer l'instance du routeur et passer l'option `routes`. +// Vous pouvez également passer des options supplémentaires, +// mais nous allons faire simple pour l'instant. const router = new VueRouter({ - routes // short for routes: routes + routes // raccourci pour routes: routes }) -// 4. Create and mount the root instance. -// Make sure to inject the router with the router option to make the -// whole app router-aware. +// 5. Créer et monter l'instance de Vue. +// Soyez sûr d'injecter le routeur avec l'option `router` pour +// permettre à l'application tout entière d'être à l'écoute du routeur. const app = new Vue({ router }).$mount('#app') @@ -64,6 +64,6 @@ const app = new Vue({ // Now the app has started! ``` -You can also checkout this example [live](http://jsfiddle.net/yyx990803/xgrjzsup/). +Vous pouvez aussi regarder cet [exemple](http://jsfiddle.net/yyx990803/xgrjzsup/). -Notice that a `` automatically gets the `.router-link-active` class when its target route is matched. You can learn more about it in its [API reference](../api/router-link.md). +Notez qu'un `` obtiendra automatiquement la classe `router-link-active` lorsque sa route cible correspond avec la route actuelle. Vous pouvez en apprendre plus à propos de cela dans sa [documentation d'API](../api/router-link.md). From 704cd2a6799a767824d7b93af44c8c434c9277ca Mon Sep 17 00:00:00 2001 From: Hugo Alliaume Date: Mon, 8 May 2017 18:34:55 +0200 Subject: [PATCH 10/90] fixes --- docs/en/essentials/getting-started.md | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/docs/en/essentials/getting-started.md b/docs/en/essentials/getting-started.md index b57f75779..2c0a50d5b 100644 --- a/docs/en/essentials/getting-started.md +++ b/docs/en/essentials/getting-started.md @@ -2,7 +2,7 @@ > Nous utiliserons [ES2015](https://github.com/lukehoban/es6features) dans les exemples de code dans ce guide. -Créer une application monopage avec Vue.js + vue-router est vraiment simple. Avec Vue.js, nous concevons déjà notre application avec des composants. En ajoutant vue-router dans notre application, tout ce qu'il nous reste à faire est de relier nos composants aux routes, et de laisser vue-router en faire le rendu. Voici un exemple de base : +Créer une application monopage avec Vue.js + vue-router est vraiment simple. Avec Vue.js, nous concevons déjà notre application avec des composants. En ajoutant vue-router dans notre application, tout ce qu'il nous reste à faire est de relier nos composants aux routes, et de laisser vue-router faire le rendu. Voici un exemple de base : > Tous les exemples utiliseront la version standalone de Vue pour rendre l'analyse de template possible. Plus de détails [ici](https://fr.vuejs.org/guide/installation.html#Runtime-Compiler-vs-Runtime-seul). @@ -30,7 +30,7 @@ Créer une application monopage avec Vue.js + vue-router est vraiment simple. Av ### JavaScript ``` js -// 0. Si vous utilisez un système de modules (e.g. via vue-cli), il faut importer Vue et VueRouter et ensuite appeler Vue.use(VueRouter). +// 0. Si vous utilisez un système de module (e.g. via vue-cli), il faut importer Vue et VueRouter et ensuite appeler Vue.use(VueRouter). // 1. Définir des composants. // Ces derniers peuvent être importés depuis d'autre fichier @@ -61,7 +61,7 @@ const app = new Vue({ router }).$mount('#app') -// Now the app has started! +// L'application est maintenant en marche ! ``` Vous pouvez aussi regarder cet [exemple](http://jsfiddle.net/yyx990803/xgrjzsup/). From 75843b520a2180c4f027d4c0295165bfe7dfec17 Mon Sep 17 00:00:00 2001 From: Bruno Lesieur Date: Tue, 9 May 2017 08:26:08 +0200 Subject: [PATCH 11/90] Remove a `,` and `et` conflict. Signed-off-by: Bruno Lesieur --- docs/en/installation.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/en/installation.md b/docs/en/installation.md index b7762017d..b57f2cea6 100644 --- a/docs/en/installation.md +++ b/docs/en/installation.md @@ -8,7 +8,7 @@ [Unpkg.com](https://unpkg.com) fournit des liens CDN basés sur NPM. Le lien ci-dessus pointera toujours vers la dernière release sur NPM. Vous pouvez aussi utiliser un tag ou une version spécifique via une URL comme `https://unpkg.com/vue-router@2.0.0/dist/vue-router.js`. -Incluez `vue-router` après Vue, et l'installation sera automatique : +Incluez `vue-router` après Vue et l'installation sera automatique : ``` html From b2315ab6219e5a9f20722c421c87224fa2797c96 Mon Sep 17 00:00:00 2001 From: Bruno Lesieur Date: Tue, 9 May 2017 08:49:48 +0200 Subject: [PATCH 12/90] Set correct repository link to help us from french translation Signed-off-by: Bruno Lesieur --- docs/en/advanced/data-fetching.md | 2 +- docs/en/advanced/lazy-loading.md | 2 +- docs/en/advanced/meta.md | 2 +- docs/en/advanced/navigation-guards.md | 2 +- docs/en/advanced/scroll-behavior.md | 2 +- docs/en/advanced/transitions.md | 2 +- docs/en/api/component-injections.md | 2 +- docs/en/api/options.md | 2 +- docs/en/api/route-object.md | 2 +- docs/en/api/router-instance.md | 2 +- docs/en/api/router-link.md | 2 +- docs/en/api/router-view.md | 2 +- docs/en/essentials/dynamic-matching.md | 2 +- docs/en/essentials/getting-started.md | 2 +- docs/en/essentials/history-mode.md | 2 +- docs/en/essentials/named-routes.md | 2 +- docs/en/essentials/named-views.md | 2 +- docs/en/essentials/navigation.md | 2 +- docs/en/essentials/nested-routes.md | 2 +- docs/en/essentials/passing-props.md | 2 +- docs/en/essentials/redirect-and-alias.md | 2 +- 21 files changed, 21 insertions(+), 21 deletions(-) diff --git a/docs/en/advanced/data-fetching.md b/docs/en/advanced/data-fetching.md index c3255de23..4a4b82807 100644 --- a/docs/en/advanced/data-fetching.md +++ b/docs/en/advanced/data-fetching.md @@ -1,4 +1,4 @@ -# Data Fetching (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-ssr-docs).* +# Data Fetching (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-router).* Sometimes you need to fetch data from the server when a route is activated. For example, before rendering a user profile, you need to fetch the user's data from the server. We can achieve this in two different ways: diff --git a/docs/en/advanced/lazy-loading.md b/docs/en/advanced/lazy-loading.md index d4366cbf1..f79b4fc8f 100644 --- a/docs/en/advanced/lazy-loading.md +++ b/docs/en/advanced/lazy-loading.md @@ -1,4 +1,4 @@ -# Lazy Loading Routes (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-ssr-docs).* +# Lazy Loading Routes (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-router).* When building apps with a bundler, the JavaScript bundle can become quite large, and thus affect the page load time. It would be more efficient if we can split each route's components into a separate chunk, and only load them when the route is visited. diff --git a/docs/en/advanced/meta.md b/docs/en/advanced/meta.md index 4203a0ef2..998b6c134 100644 --- a/docs/en/advanced/meta.md +++ b/docs/en/advanced/meta.md @@ -1,4 +1,4 @@ -# Route Meta Fields (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-ssr-docs).* +# Route Meta Fields (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-router).* You can include a `meta` field when defining a route: diff --git a/docs/en/advanced/navigation-guards.md b/docs/en/advanced/navigation-guards.md index e385a1fc9..75e3a0b89 100644 --- a/docs/en/advanced/navigation-guards.md +++ b/docs/en/advanced/navigation-guards.md @@ -1,4 +1,4 @@ -# Navigation Guards (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-ssr-docs).* +# Navigation Guards (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-router).* As the name suggests, the navigation guards provided by `vue-router` are primarily used to guard navigations either by redirecting it or canceling it. There are a number of ways to hook into the route navigation process: globally, per-route, or in-component. diff --git a/docs/en/advanced/scroll-behavior.md b/docs/en/advanced/scroll-behavior.md index c075c2972..c600df87d 100644 --- a/docs/en/advanced/scroll-behavior.md +++ b/docs/en/advanced/scroll-behavior.md @@ -1,4 +1,4 @@ -# Scroll Behavior (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-ssr-docs).* +# Scroll Behavior (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-router).* When using client-side routing, we may want to scroll to top when navigating to a new route, or preserve the scrolling position of history entries just like real page reload does. `vue-router` allows you to achieve these and even better, allows you to completely customize the scroll behavior on route navigation. diff --git a/docs/en/advanced/transitions.md b/docs/en/advanced/transitions.md index 68e35b976..240fe676e 100644 --- a/docs/en/advanced/transitions.md +++ b/docs/en/advanced/transitions.md @@ -1,4 +1,4 @@ -# Transitions (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-ssr-docs).* +# Transitions (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-router).* Since the `` is essentially a dynamic component, we can apply transition effects to it the same way using the `` component: diff --git a/docs/en/api/component-injections.md b/docs/en/api/component-injections.md index 6cb8391c8..c55c713d2 100644 --- a/docs/en/api/component-injections.md +++ b/docs/en/api/component-injections.md @@ -1,4 +1,4 @@ -# Component Injections (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-ssr-docs).* +# Component Injections (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-router).* ### Injected Properties diff --git a/docs/en/api/options.md b/docs/en/api/options.md index 0264c2c5f..d7674fba7 100644 --- a/docs/en/api/options.md +++ b/docs/en/api/options.md @@ -1,4 +1,4 @@ -# Router Construction Options (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-ssr-docs).* +# Router Construction Options (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-router).* ### routes diff --git a/docs/en/api/route-object.md b/docs/en/api/route-object.md index 00578dd2c..1815f6828 100644 --- a/docs/en/api/route-object.md +++ b/docs/en/api/route-object.md @@ -1,4 +1,4 @@ -# The Route Object (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-ssr-docs).* +# The Route Object (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-router).* A **route object** represents the state of the current active route. It contains parsed information of the current URL and the **route records** matched by the URL. diff --git a/docs/en/api/router-instance.md b/docs/en/api/router-instance.md index a4e69259e..6dd6ba3da 100644 --- a/docs/en/api/router-instance.md +++ b/docs/en/api/router-instance.md @@ -1,4 +1,4 @@ -# Router Instance (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-ssr-docs).* +# Router Instance (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-router).* ### Properties diff --git a/docs/en/api/router-link.md b/docs/en/api/router-link.md index 729b7d634..38d469906 100644 --- a/docs/en/api/router-link.md +++ b/docs/en/api/router-link.md @@ -1,4 +1,4 @@ -# `` (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-ssr-docs).* +# `` (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-router).* `` is the component for enabling user navigation in a router-enabled app. The target location is specified with the `to` prop. It renders as an `` tag with correct `href` by default, but can be configured with the `tag` prop. In addition, the link automatically gets an active CSS class when the target route is active. diff --git a/docs/en/api/router-view.md b/docs/en/api/router-view.md index a099a197f..e6bd94c14 100644 --- a/docs/en/api/router-view.md +++ b/docs/en/api/router-view.md @@ -1,4 +1,4 @@ -# `` (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-ssr-docs).* +# `` (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-router).* The `` component is a functional component that renders the matched component for the given path. Components rendered in `` can also contain its own ``, which will render components for nested paths. diff --git a/docs/en/essentials/dynamic-matching.md b/docs/en/essentials/dynamic-matching.md index 933ab86b7..b52be5088 100644 --- a/docs/en/essentials/dynamic-matching.md +++ b/docs/en/essentials/dynamic-matching.md @@ -1,4 +1,4 @@ -# Dynamic Route Matching (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-ssr-docs).* +# Dynamic Route Matching (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-router).* Very often we will need to map routes with the given pattern to the same component. For example we may have a `User` component which should be rendered for all users but with different user IDs. In `vue-router` we can use a dynamic segment in the path to achieve that: diff --git a/docs/en/essentials/getting-started.md b/docs/en/essentials/getting-started.md index dcbf5d068..a035036e7 100644 --- a/docs/en/essentials/getting-started.md +++ b/docs/en/essentials/getting-started.md @@ -1,4 +1,4 @@ -# Getting Started (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-ssr-docs).* +# Getting Started (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-router).* > We will be using [ES2015](https://github.com/lukehoban/es6features) in the code samples in the guide. diff --git a/docs/en/essentials/history-mode.md b/docs/en/essentials/history-mode.md index 853902e11..36e1a1b2e 100644 --- a/docs/en/essentials/history-mode.md +++ b/docs/en/essentials/history-mode.md @@ -1,4 +1,4 @@ -# HTML5 History Mode (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-ssr-docs).* +# HTML5 History Mode (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-router).* The default mode for `vue-router` is _hash mode_ - it uses the URL hash to simulate a full URL so that the page won't be reloaded when the URL changes. diff --git a/docs/en/essentials/named-routes.md b/docs/en/essentials/named-routes.md index b2a830f36..8e03b5dd6 100644 --- a/docs/en/essentials/named-routes.md +++ b/docs/en/essentials/named-routes.md @@ -1,4 +1,4 @@ -# Named Routes (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-ssr-docs).* +# Named Routes (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-router).* Sometimes it is more convenient to identify a route with a name, especially when linking to a route or performing navigations. You can give a route a name in the `routes` options while creating the Router instance: diff --git a/docs/en/essentials/named-views.md b/docs/en/essentials/named-views.md index a690fb90f..3a28369d7 100644 --- a/docs/en/essentials/named-views.md +++ b/docs/en/essentials/named-views.md @@ -1,4 +1,4 @@ -# Named Views (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-ssr-docs).* +# Named Views (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-router).* Sometimes you need to display multiple views at the same time instead of nesting them, e.g. creating a layout with a `sidebar` view and a `main` view. This is where named views came in handy. Instead of having one single outlet in your view, you can have multiple and give each of them a name. A `router-view` without a name will be given `default` as its name. diff --git a/docs/en/essentials/navigation.md b/docs/en/essentials/navigation.md index 7879b7569..af7cd6477 100644 --- a/docs/en/essentials/navigation.md +++ b/docs/en/essentials/navigation.md @@ -1,4 +1,4 @@ -# Programmatic Navigation (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-ssr-docs).* +# Programmatic Navigation (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-router).* Aside from using `` to create anchor tags for declarative navigation, we can do this programmatically using the router's instance methods. diff --git a/docs/en/essentials/nested-routes.md b/docs/en/essentials/nested-routes.md index 4e535be89..fc76d4b3c 100644 --- a/docs/en/essentials/nested-routes.md +++ b/docs/en/essentials/nested-routes.md @@ -1,4 +1,4 @@ -# Nested Routes (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-ssr-docs).* +# Nested Routes (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-router).* Real app UIs are usually composed of components that are nested multiple levels deep. It is also very common that the segments of a URL corresponds to a certain structure of nested components, for example: diff --git a/docs/en/essentials/passing-props.md b/docs/en/essentials/passing-props.md index 4ab35110f..6ed2711c3 100644 --- a/docs/en/essentials/passing-props.md +++ b/docs/en/essentials/passing-props.md @@ -1,4 +1,4 @@ -# Passing Props to Route Components (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-ssr-docs).* +# Passing Props to Route Components (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-router).* Using `$route` in your component creates a tight coupling with the route which limits the flexibility of the component as it can only be used on certain urls. diff --git a/docs/en/essentials/redirect-and-alias.md b/docs/en/essentials/redirect-and-alias.md index f963595bf..91033aefb 100644 --- a/docs/en/essentials/redirect-and-alias.md +++ b/docs/en/essentials/redirect-and-alias.md @@ -1,4 +1,4 @@ -# Redirect and Alias (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-ssr-docs).* +# Redirect and Alias (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-router).* ### Redirect From 02c5dac8731062cb81aa102866f8f4e679a069fb Mon Sep 17 00:00:00 2001 From: Hugo Alliaume Date: Thu, 11 May 2017 10:54:28 +0200 Subject: [PATCH 13/90] =?UTF-8?q?Modifications=20suite=20=C3=A0=20la=20rev?= =?UTF-8?q?iew=20de=20@Haeresis?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- docs/en/essentials/getting-started.md | 22 +++++++++++----------- 1 file changed, 11 insertions(+), 11 deletions(-) diff --git a/docs/en/essentials/getting-started.md b/docs/en/essentials/getting-started.md index b24016640..ddd9f546e 100644 --- a/docs/en/essentials/getting-started.md +++ b/docs/en/essentials/getting-started.md @@ -15,8 +15,8 @@ Créer une application monopage avec Vue.js + vue-router est vraiment simple. Av

Bonjour l'application !

- - + + Aller à Foo Aller à Bar @@ -30,16 +30,16 @@ Créer une application monopage avec Vue.js + vue-router est vraiment simple. Av ### JavaScript ``` js -// 0. Si vous utilisez un système de module (e.g. via vue-cli), il faut importer Vue et VueRouter et ensuite appeler Vue.use(VueRouter). +// 0. Si vous utilisez un système de module (ex : via vue-cli), il faut importer Vue et VueRouter et ensuite appeler Vue.use(VueRouter). -// 1. Définir des composants. +// 1. Définissez les composants de route. // Ces derniers peuvent être importés depuis d'autre fichier const Foo = { template: '

foo
' } const Bar = { template: '
bar
' } -// 2. Définir des routes. -// Chaque route doit corresponde à un composant. Le "composant" peut -// soit être un véritable composant créé via Vue.extend(), ou juste un +// 2. Définissez des routes. +// Chaque route doit correspondre à un composant. Le « composant » peut +// soit être un véritable composant créé via `Vue.extend()`, ou juste un // objet d'options. // Nous parlerons plus tard des routes imbriquées. const routes = [ @@ -47,14 +47,14 @@ const routes = [ { path: '/bar', component: Bar } ] -// 3. Créer l'instance du routeur et passer l'option `routes`. +// 3. Créez l'instance du routeur et passez l'option `routes`. // Vous pouvez également passer des options supplémentaires, // mais nous allons faire simple pour l'instant. const router = new VueRouter({ - routes // raccourci pour routes: routes + routes // raccourci pour `routes: routes` }) -// 5. Créer et monter l'instance de Vue. +// 5. Créez et montez l'instance de Vue. // Soyez sûr d'injecter le routeur avec l'option `router` pour // permettre à l'application tout entière d'être à l'écoute du routeur. const app = new Vue({ @@ -66,4 +66,4 @@ const app = new Vue({ Vous pouvez aussi regarder cet [exemple](http://jsfiddle.net/yyx990803/xgrjzsup/). -Notez qu'un `` obtiendra automatiquement la classe `router-link-active` lorsque sa route cible correspond avec la route actuelle. Vous pouvez en apprendre plus à propos de cela dans sa [documentation d'API](../api/router-link.md). +Notez qu'un `` obtiendra automatiquement la classe `.router-link-active` lorsque sa route cible correspond avec la route actuelle. Vous pouvez en apprendre plus à propos de cela dans sa [documentation d'API](../api/router-link.md). From f6466949fd76f1a24b1144218036b4d8ef41cd59 Mon Sep 17 00:00:00 2001 From: Hugo Alliaume Date: Thu, 11 May 2017 11:30:25 +0200 Subject: [PATCH 14/90] =?UTF-8?q?Modifications=20suite=20=C3=A0=20la=202?= =?UTF-8?q?=C3=A8me=20review=20de=20@Haeresis?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- docs/en/essentials/getting-started.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/docs/en/essentials/getting-started.md b/docs/en/essentials/getting-started.md index ddd9f546e..a218a1bf7 100644 --- a/docs/en/essentials/getting-started.md +++ b/docs/en/essentials/getting-started.md @@ -66,4 +66,4 @@ const app = new Vue({ Vous pouvez aussi regarder cet [exemple](http://jsfiddle.net/yyx990803/xgrjzsup/). -Notez qu'un `` obtiendra automatiquement la classe `.router-link-active` lorsque sa route cible correspond avec la route actuelle. Vous pouvez en apprendre plus à propos de cela dans sa [documentation d'API](../api/router-link.md). +Notez qu'un `` obtiendra automatiquement la classe `.router-link-active` lorsque sa route cible correspond à la route actuelle. Vous pouvez en apprendre plus à propos de cela dans sa [documentation d'API](../api/router-link.md). From 33922e7801f7245cf8e04f2abca6e3bbaf56ca01 Mon Sep 17 00:00:00 2001 From: Bruno Lesieur Date: Thu, 18 May 2017 13:52:20 +0200 Subject: [PATCH 15/90] Typo fixes Signed-off-by: Bruno Lesieur --- docs/en/essentials/getting-started.md | 14 +++++++------- 1 file changed, 7 insertions(+), 7 deletions(-) diff --git a/docs/en/essentials/getting-started.md b/docs/en/essentials/getting-started.md index a218a1bf7..2e2ce800f 100644 --- a/docs/en/essentials/getting-started.md +++ b/docs/en/essentials/getting-started.md @@ -15,9 +15,9 @@ Créer une application monopage avec Vue.js + vue-router est vraiment simple. Av

Bonjour l'application !

- + - + Aller à Foo Aller à Bar

@@ -30,7 +30,7 @@ Créer une application monopage avec Vue.js + vue-router est vraiment simple. Av ### JavaScript ``` js -// 0. Si vous utilisez un système de module (ex : via vue-cli), il faut importer Vue et VueRouter et ensuite appeler Vue.use(VueRouter). +// 0. Si vous utilisez un système de module (ex : via vue-cli), il faut importer Vue et VueRouter et ensuite appeler Vue.use(VueRouter). // 1. Définissez les composants de route. // Ces derniers peuvent être importés depuis d'autre fichier @@ -39,8 +39,8 @@ const Bar = { template: '
bar
' } // 2. Définissez des routes. // Chaque route doit correspondre à un composant. Le « composant » peut -// soit être un véritable composant créé via `Vue.extend()`, ou juste un -// objet d'options. +// soit être un véritable composant créé via `Vue.extend()`, ou juste un +// objet d'options. // Nous parlerons plus tard des routes imbriquées. const routes = [ { path: '/foo', component: Foo }, @@ -48,14 +48,14 @@ const routes = [ ] // 3. Créez l'instance du routeur et passez l'option `routes`. -// Vous pouvez également passer des options supplémentaires, +// Vous pouvez également passer des options supplémentaires, // mais nous allons faire simple pour l'instant. const router = new VueRouter({ routes // raccourci pour `routes: routes` }) // 5. Créez et montez l'instance de Vue. -// Soyez sûr d'injecter le routeur avec l'option `router` pour +// Soyez sûr d'injecter le routeur avec l'option `router` pour // permettre à l'application tout entière d'être à l'écoute du routeur. const app = new Vue({ router From 1b9ec6f9e3e0583b912165fe7b338e8968c3ca27 Mon Sep 17 00:00:00 2001 From: Hugo Alliaume Date: Tue, 23 May 2017 18:42:25 +0200 Subject: [PATCH 16/90] Traduction de `api/component-injections.md` et `api/router-instance.md` --- docs/en/SUMMARY.md | 4 +-- docs/en/advanced/navigation-guards.md | 2 +- docs/en/api/component-injections.md | 16 ++++----- docs/en/api/router-instance.md | 50 +++++++++++++-------------- 4 files changed, 36 insertions(+), 36 deletions(-) diff --git a/docs/en/SUMMARY.md b/docs/en/SUMMARY.md index 6f34288c7..3c68492f2 100644 --- a/docs/en/SUMMARY.md +++ b/docs/en/SUMMARY.md @@ -27,5 +27,5 @@ - [router-view (En)](api/router-view.md) - [The Route Object (En)](api/route-object.md) - [Router Constructor Options (En)](api/options.md) - - [Router Instance (En)](api/router-instance.md) - - [Component Injections (En)](api/component-injections.md) + - [L'Instance Routeur](api/router-instance.md) + - [Injections de composant](api/component-injections.md) diff --git a/docs/en/advanced/navigation-guards.md b/docs/en/advanced/navigation-guards.md index e385a1fc9..9b2230b11 100644 --- a/docs/en/advanced/navigation-guards.md +++ b/docs/en/advanced/navigation-guards.md @@ -72,7 +72,7 @@ const router = new VueRouter({ These guards have the exact same signature as global before guards. -### In-Component Guards +### Sécurisation intra-composants Finally, you can directly define route navigation guards inside route components (the ones passed to the router configuration) with the following options: diff --git a/docs/en/api/component-injections.md b/docs/en/api/component-injections.md index 6cb8391c8..c98415a6b 100644 --- a/docs/en/api/component-injections.md +++ b/docs/en/api/component-injections.md @@ -1,21 +1,21 @@ -# Component Injections (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-ssr-docs).* +# Injections de composant -### Injected Properties +### Propriétés injectées -These properties are injected into every child component by passing the router instance to the root instance as the `router` option. +Ces propriétés sont injectées dans chacun des composants enfants, en passant l'instance du routeur à l'application racine de Vue en tant qu'option `router`. - #### $router - The router instance. + L'instance du routeur. - #### $route - The current active [Route](route-object.md). This property is read-only and its properties are immutable, but it can be watched. + La [Route](route-object.md) actuellement active. C'est une propriété en lecture seule et ses propriétés sont immutables, mais elles restent malgré tout observables. -### Enabled Options +### Options activées - **beforeRouteEnter** -- **beforeRouteUpdate** (added in 2.2) +- **beforeRouteUpdate** (ajouté en 2.2) - **beforeRouteLeave** - See [In Component Guards](../advanced/navigation-guards.md#incomponent-guards). + Voir la [Sécurisation intra-composants](../advanced/navigation-guards.md#securisation-intra-composants). diff --git a/docs/en/api/router-instance.md b/docs/en/api/router-instance.md index a4e69259e..f25231096 100644 --- a/docs/en/api/router-instance.md +++ b/docs/en/api/router-instance.md @@ -1,34 +1,34 @@ -# Router Instance (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-ssr-docs).* +# L'Instance Routeur -### Properties +### Propriétés #### router.app -- type: `Vue instance` +- type: `instance de Vue` - The root Vue instance the `router` was injected into. + L'instance racine de Vue dans laquelle l'instance de `routeur` a été injectée. #### router.mode - type: `string` - The [mode](options.md#mode) the router is using. + Le [mode](options.md#mode) que le routeur utilise. #### router.currentRoute - type: `Route` - The current route represented as a [Route Object](route-object.md). + La route actuelle représentée en tant qu'un [Objet Route](route-object.md). -### Methods +### Méthodes - **router.beforeEach(guard)** - **router.beforeResolve(guard)** (2.5.0+) - **router.afterEach(hook)** - Add global navigation guards. See [Navigation Guards](../advanced/navigation-guards.md). + Ajout de sécurités globales de navigation. Voir les [sécurités de navigation](../advanced/navigation-guards.md). - In 2.5.0+ all three methods return a function that removes the registered guard/hook. + Dans la version 2.5.0+, ces trois méthodes retournent une fonction qui enlève les fonctions de sécurisations et hooks enregistrés. - **router.push(location, onComplete?, onAbort?)** - **router.replace(location, onComplete?, onAbort?)** @@ -36,18 +36,18 @@ - **router.back()** - **router.forward()** - Programmatically navigate to a new URL. See [Programmatic Navigation](../essentials/navigation.md). + Navigue à une nouvelle URL de façon programmée. Voir [Navigation de façon programmée](../essentials/navigation.md). - **router.getMatchedComponents(location?)** - Returns an Array of the components (definition/constructor, not instances) matched by the provided location or the current route. This is mostly used during server-side rendering to perform data prefetching. - + Retourne un `Array` des composants (définition/constructeur et non les instances) correspondant à la `location` passée en paramètre, ou alors de la route actuelle. Cette fonction est principalement utilisée pendant le rendu côté serveur afin d'effectuer une pré-récupération des données. + - **router.resolve(location, current?, append?)** > 2.1.0+ - Reverse URL resolving. Given location in form same as used in ``, returns object with the following resolved properties: - + Inverse la résolution d'URL. La `location` doit avoir la même forme qu'utilisée dans ``, retourne un `Object` avec les propriétés suivantes : + ``` js { location: Location; @@ -60,26 +60,26 @@ > 2.2.0+ - Dynamically add more routes to the router. The argument must be an Array using the same route config format with the `routes` constructor option. - + Permet d'ajouter dynamiquement des routes au routeur. L'argument doit être un `Array` utilisant le même format de configuration que l'option `routes` du constructeur. + - **router.onReady(callback, [errorCallback])** > 2.2.0+ - This method queues a callback to be called when the router has completed the initial navigation, which means it has resolved all async enter hooks and async components that are associated with the initial route. + Cette méthode met en file d'attente une fonction de rappel qui sera appelée lorsque le routeur aura complété la navigation initiale, ce qui signifie qu'il a résolu tous les hooks d'entrée asynchrones et composants asynchrones qui sont associés à la route initiale. - This is useful in server-side rendering to ensure consistent output on both the server and the client. - - The second argument `errorCallback` is only supported in 2.4+. It will be called when the initial route resolution runs into an error (e.g. failed to resolve an async component). + C'est utile pendant un rendu côté serveur pour assurer une sortie consistance sur le serveur et le client. + Le deuxième argument `errorCallback` est uniquement supporté à partir de la version 2.4. Il sera appelé lorsque la résolution de la route initiale résultera en une erreur (ex : la résolution d'un composant asynchrone qui a échouée). + - **router.onError(callback)** > 2.4.0+ - Register a callback which will be called when an error is caught during a route navigation. Note for an error to be called, it must be one of the following scenarios: - - - The error is thrown synchronously inside a route guard function; + Enregistre une fonction de rappel qui sera appelée lorsqu'une erreur sera capturée pendant la navigation à une route. Notez que pour qu'une erreur soit appelée, cela doit correspondre à l'un des scénarios suivants : - - The error is caught and asynchronously handled by calling `next(err)` inside a route guard function; + - L'erreur est lancée de manière synchrone à l'intérieur d'une fonction de sécurisation de route ; - - An error occurred when trying to resolve an async component that is required to render a route. + - L'erreur est capturée et traitée de manière asynchrone en appelant `next(err)` à l'intérieur d'une fonction de sécurisation de route ; + + - Une erreur est survenue pendant la résolution d'un composant asynchrone qui est requis pour faire le rendu d'une route. From efc73c6a72ff29b7faf5ebcfe2e8ef2fa7ba371c Mon Sep 17 00:00:00 2001 From: Hugo Alliaume Date: Tue, 23 May 2017 20:57:19 +0200 Subject: [PATCH 17/90] Traduction de `api/options.md` --- docs/en/SUMMARY.md | 2 +- docs/en/api/options.md | 52 +++++++++++++++++++++--------------------- 2 files changed, 27 insertions(+), 27 deletions(-) diff --git a/docs/en/SUMMARY.md b/docs/en/SUMMARY.md index b318f5244..4484ee147 100644 --- a/docs/en/SUMMARY.md +++ b/docs/en/SUMMARY.md @@ -26,6 +26,6 @@ - [router-link (En)](api/router-link.md) - [router-view (En)](api/router-view.md) - [The Route Object (En)](api/route-object.md) - - [Router Constructor Options (En)](api/options.md) + - [Options de Construction du Routeur](api/options.md) - [Router Instance (En)](api/router-instance.md) - [Component Injections (En)](api/component-injections.md) diff --git a/docs/en/api/options.md b/docs/en/api/options.md index d7674fba7..43c20e08f 100644 --- a/docs/en/api/options.md +++ b/docs/en/api/options.md @@ -1,21 +1,21 @@ -# Router Construction Options (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-router).* +# Options de Construction du Routeur ### routes - type: `Array` - Type declaration for `RouteConfig`: + Déclaration de type pour `RouteConfig` : ``` js declare type RouteConfig = { path: string; component?: Component; - name?: string; // for named routes - components?: { [name: string]: Component }; // for named views + name?: string; // pour les routes nommées + components?: { [name: string]: Component }; // pour les vues nommées redirect?: string | Location | Function; props?: boolean | string | Function; alias?: string | Array; - children?: Array; // for nested routes + children?: Array; // pour les routes imbriquées beforeEnter?: (to: Route, from: Route, next: Function) => void; meta?: any; } @@ -23,51 +23,51 @@ ### mode -- type: `string` +- type : `string` -- default: `"hash" (in browser) | "abstract" (in Node.js)` +- défaut : `"hash" (dans le navigateur) | "abstract" (dans Node.js)` -- available values: `"hash" | "history" | "abstract"` +- valeurs disponibles : `"hash" | "history" | "abstract"` - Configure the router mode. + Configure le mode du routeur. - - `hash`: uses the URL hash for routing. Works in all Vue-supported browsers, including those that do not support HTML5 History API. + - `hash` : utilise le hash de l'URL pour le routage. Fonctionne dans tous les navigateurs supportés par Vue, ainsi que ceux qui ne supportent pas l'API History d'HTML5. - - `history`: requires HTML5 History API and server config. See [HTML5 History Mode](../essentials/history-mode.md). + - `history` : nécessite l'API History d'HTML 5 et la configuration du serveur. Voir [Mode d'Historique HTML5](../essentials/history-mode.md). - - `abstract`: works in all JavaScript environments, e.g. server-side with Node.js. **The router will automatically be forced into this mode if no browser API is present.** + - `abstract` : fonctionne dans tous les environnements JavaScript, ex. côté serveur avec Node.js. **Le routeur sera automatiquement forcé d'utiliser ce mode si aucune API navigateur n'est présente.** ### base -- type: `string` +- type : `string` -- default: `"/"` +- défaut : `"/"` - The base URL of the app. For example, if the entire single page application is served under `/app/`, then `base` should use the value `"/app/"`. + L'URL de base de l'application. Par exemple, si l'entière application monopage est distribuée sous `/app/`, alors `base` doit utiliser la valeur `"/app/"`. ### linkActiveClass -- type: `string` +- type : `string` -- default: `"router-link-active"` +- défaut : `"router-link-active"` - Globally configure `` default active class. Also see [router-link](router-link.md). + Configure de manière globale la classe active par défaut de ``. Voir aussi [router-link](router-link.md). ### linkExactActiveClass > 2.5.0+ -- type: `string` +- type : `string` -- default: `"router-link-exact-active"` +- default : `"router-link-exact-active"` - Globally configure `` default active class for exact matches. Also see [router-link](router-link.md). + Configure de manière globale la classe active par défaut de `` lors d'une correspondance exact. Voir aussi [router-link](router-link.md). ### scrollBehavior -- type: `Function` +- type : `Function` - Signature: + Signature : ``` ( @@ -77,12 +77,12 @@ ) => { x: number, y: number } | { selector: string } | ?{} ``` - For more details see [Scroll Behavior](../advanced/scroll-behavior.md). + Pour plus de détails, voir [Comportement du Scroll](../advanced/scroll-behavior.md). ### parseQuery / stringifyQuery > 2.4.0+ -- type: `Function` +- type : `Function` - Provide custom query string parse / stringify functions. Overrides the default. + Permet de spécifier des fonctions customisées pour parser / stringifier la requête. Surcharge les fonctions par défaut. From ef8aadbecafe035eb8b8db5015a31de1dfefafb4 Mon Sep 17 00:00:00 2001 From: Hugo Alliaume Date: Tue, 23 May 2017 22:11:11 +0200 Subject: [PATCH 18/90] Traduction de `api/route-object.md` --- docs/en/SUMMARY.md | 2 +- docs/en/api/route-object.md | 58 ++++++++++++++++++------------------- 2 files changed, 30 insertions(+), 30 deletions(-) diff --git a/docs/en/SUMMARY.md b/docs/en/SUMMARY.md index b318f5244..0510ffdb9 100644 --- a/docs/en/SUMMARY.md +++ b/docs/en/SUMMARY.md @@ -25,7 +25,7 @@ - Réference de l'API - [router-link (En)](api/router-link.md) - [router-view (En)](api/router-view.md) - - [The Route Object (En)](api/route-object.md) + - [L'Objet Route](api/route-object.md) - [Router Constructor Options (En)](api/options.md) - [Router Instance (En)](api/router-instance.md) - [Component Injections (En)](api/component-injections.md) diff --git a/docs/en/api/route-object.md b/docs/en/api/route-object.md index 1815f6828..6833d61a2 100644 --- a/docs/en/api/route-object.md +++ b/docs/en/api/route-object.md @@ -1,80 +1,80 @@ -# The Route Object (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-router).* +# L'Objet `Route` -A **route object** represents the state of the current active route. It contains parsed information of the current URL and the **route records** matched by the URL. +Un **objet `Route`** représente l'état de actuel de la route active. Il contient des informations analysées à propos de l'URL courante et **les itinéraires de route** appariés par l'URL. -The route object is immutable. Every successful navigation will result in a fresh route object. +L'objet `Route` est immutable. Chaque navigation qui se déroule avec succès résultera en un nouvel objet `Route`. -The route object can be found in multiple places: +L'objet `Route` peut être trouvé à plusieurs endroits : -- Inside components as `this.$route` +- À l'intérieur des composants en tan que `this.$route` -- Inside `$route` watcher callbacks +- À l'intérieur des fonctions de rappel de pendant l'observation de `$route` -- As the return value of calling `router.match(location)` +- Comme valeur de retour après l'appel de `router.match(location)` -- Inside navigation guards as the first two arguments: +- À l'intérieur des fonctions de sécurisation de la navigation, dans les deux premiers paramètres de la fonction : ``` js router.beforeEach((to, from, next) => { - // to and from are both route objects + // to et from sont tous les deux des objets Route }) ``` -- Inside the `scrollBehavior` function as the first two arguments: +- À l'intérieur de la fonction `scrollBehavior` dans les deux premiers arguments : ``` js const router = new VueRouter({ scrollBehavior (to, from, savedPosition) { - // to and from are both route objects + // to et from sont tous les deux des objets Route } }) ``` -### Route Object Properties +### Propriétés de l'Objet Route - **$route.path** - - type: `string` + - type : `string` - A string that equals the path of the current route, always resolved as an absolute path. e.g. `"/foo/bar"`. + Une chaîne de caractères représentant le chemin de la route en cours, toujours résolue en tant que chemin absolu, ex : `"/foo/bar"`. - **$route.params** - - type: `Object` + - type : `Object` - An object that contains key/value pairs of dynamic segments and star segments. If there are no params the value will be an empty object. + Un objet qui contient des pairs clé/valeur de segments dynamiques et segments *star*. S'il n'y a pas de paramètres, alors la valeur sera un objet vide. - **$route.query** - - type: `Object` - - An object that contains key/value pairs of the query string. For example, for a path `/foo?user=1`, we get `$route.query.user == 1`. If there is no query the value will be an empty object. + - type : `Object` + Un objet qui contient des pairs clé/valeur de la requête au format d'une chaîne de caractères. Par exemple, pour un chemin `/foo?user=1`, on aura `$route.query.user == 1`. S'il n'y a pas de requête, alors la valeur sera un objet vide. + - **$route.hash** - - type: `string` + - type : `string` - The hash of the current route (with the `#`), if it has one. If no hash is present the value will be an empty string. + Le hash de la route courante (avec le `#`), s'il y en a un. S'il n'y a pas de hash, alors la valeur sera une chaîne de caractères vide. - **$route.fullPath** - - type: `string` + - type : `string` - The full resolved URL including query and hash. + L'URL entièrement résolue, incluant la requête et le hash. - **$route.matched** - - type: `Array` + - type : `Array` - An Array containing **route records** for all nested path segments of the current route. Route records are the copies of the objects in the `routes` configuration Array (and in `children` Arrays): + Un `Array` contenant les **les itinéraires de la route** pour chaque segment de chemin imbriqué de la route courante. Les itinéraires de la route sont des copies des objets dans l'`Array` de configuration `routes` (et dans les `Array`s `children`). ``` js const router = new VueRouter({ routes: [ - // the following object is a route record + // l'objet qui suit est un itinéraire de route { path: '/foo', component: Foo, children: [ - // this is also a route record + // c'est aussi un itinéraire { path: 'bar', component: Bar } ] } @@ -82,8 +82,8 @@ The route object can be found in multiple places: }) ``` - When the URL is `/foo/bar`, `$route.matched` will be an Array containing both objects (cloned), in parent to child order. + Lorsque l'URL sera `/foo/bar`, `$route.matched` sera un `Array` contenant les deux objets (clonés), dans l'ordre parent à l'enfant. - **$route.name** - The name of the current route, if it has one. (See [Named Routes](../essentials/named-routes.md)) + Le nom de la route courante, si elle en a un. (Voir [Routes nommées](../essentials/named-routes.md)). From 4b35848d81d21a80b364d6fa9da5c0ce2380d36f Mon Sep 17 00:00:00 2001 From: Hugo Alliaume Date: Tue, 23 May 2017 22:35:04 +0200 Subject: [PATCH 19/90] Traduction de `api/router-view.md` --- docs/en/SUMMARY.md | 2 +- docs/en/api/router-view.md | 16 ++++++++-------- 2 files changed, 9 insertions(+), 9 deletions(-) diff --git a/docs/en/SUMMARY.md b/docs/en/SUMMARY.md index b318f5244..310400142 100644 --- a/docs/en/SUMMARY.md +++ b/docs/en/SUMMARY.md @@ -24,7 +24,7 @@ - [Lazy Loading (En)](advanced/lazy-loading.md) - Réference de l'API - [router-link (En)](api/router-link.md) - - [router-view (En)](api/router-view.md) + - [router-view](api/router-view.md) - [The Route Object (En)](api/route-object.md) - [Router Constructor Options (En)](api/options.md) - [Router Instance (En)](api/router-instance.md) diff --git a/docs/en/api/router-view.md b/docs/en/api/router-view.md index e6bd94c14..832a9796d 100644 --- a/docs/en/api/router-view.md +++ b/docs/en/api/router-view.md @@ -1,22 +1,22 @@ -# `` (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-router).* +# `` -The `` component is a functional component that renders the matched component for the given path. Components rendered in `` can also contain its own ``, which will render components for nested paths. +Le composant `` est un composant fonctionnel qui fait le rendu du composant correspondant au chemin donné. Les composants rendus dans `` peuvent aussi contenir leur propre ``, qui fera le rendu des composants pour les chemins imbriqués. ### Props - **name** - - type: `string` + - type : `string` - - default: `"default"` + - défaut : `"default"` - When a `` has a name, it will render the component with the corresponding name in the matched route record's `components` option. See [Named Views](../essentials/named-views.md) for an example. + Lorsqu'un `` a un nom, il fera le rendu du composant correspondant à ce nom dans les itinéraires de route correspondant à l'option `components`. Voir les [Routes nommées](../essentials/named-views.md) pour un example. -### Behavior +### Comportement -Any non-name props will be passed along to the rendered component, however most of the time the per-route data is contained in the route's params. +Les propriétés sans nom seront passées le long du composant rendu, toutefois la plupart du temps, les données par-route seront contenues dans les paramètres de la route. -Since it's just a component, it works with `` and ``. When using the both together, make sure to use `` inside: +Car c'est juste un composant, il fonctionne avec `` et ``. Lorsque vous utilisez les deux ensemble, soyez sûr d'utiliser ` à l'intérieur : ``` html From f2a706048e0f1b08aee465f762eabc4c68441ce7 Mon Sep 17 00:00:00 2001 From: Hugo Alliaume Date: Wed, 24 May 2017 07:49:13 +0200 Subject: [PATCH 20/90] Traduction de `api/router-link.md` --- docs/en/SUMMARY.md | 2 +- docs/en/api/router-link.md | 108 ++++++++++++++++++------------------- 2 files changed, 55 insertions(+), 55 deletions(-) diff --git a/docs/en/SUMMARY.md b/docs/en/SUMMARY.md index b318f5244..ea7e580db 100644 --- a/docs/en/SUMMARY.md +++ b/docs/en/SUMMARY.md @@ -23,7 +23,7 @@ - [Scroll Behavior (En)](advanced/scroll-behavior.md) - [Lazy Loading (En)](advanced/lazy-loading.md) - Réference de l'API - - [router-link (En)](api/router-link.md) + - [router-link](api/router-link.md) - [router-view (En)](api/router-view.md) - [The Route Object (En)](api/route-object.md) - [Router Constructor Options (En)](api/options.md) diff --git a/docs/en/api/router-link.md b/docs/en/api/router-link.md index 38d469906..0ed3fc4f6 100644 --- a/docs/en/api/router-link.md +++ b/docs/en/api/router-link.md @@ -1,54 +1,54 @@ -# `` (En)

*Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-router).* +# `` -`` is the component for enabling user navigation in a router-enabled app. The target location is specified with the `to` prop. It renders as an `` tag with correct `href` by default, but can be configured with the `tag` prop. In addition, the link automatically gets an active CSS class when the target route is active. +`` est le composant pour activer la navigation utilisateur dans une application où le routeur est activé. La localisation cible est spécifiée grâce à la prop `to`. Il est rendu en tant que tag `` avec le `href` correct par défaut, mais peut être configuré grâce à la prop `tag`. De plus, le lien se vera attribuer une classe CSS active lorsque la route cible est active. -`` is preferred over hard-coded `` for the following reasons: +`` est préféré par rapport au `` hard-codé pour les raisons suivantes : -- It works the same way in both HTML5 history mode and hash mode, so if you ever decide to switch mode, or when the router falls back to hash mode in IE9, nothing needs to be changed. +- Cela fonctionne de la même manière qu'on soit dans le mode historique HTML5 ou le mode hash, donc si vous avez décidé de changer de mode, ou alors que le routeur se replie sur le mode hash pour IE9, rien n'a besoin d'être changé. -- In HTML5 history mode, `router-link` will intercept the click event so that the browser doesn't try to reload the page. +- Dans le mode historique HTML5, `router-link` interceptera l'événement du clic, comme ça le navigateur n'essaiera pas de rafraîchir la page. -- When you are using the `base` option in HTML5 history mode, you don't need to include it in `to` prop's URLs. +- En utilisant l'option `base` dans le mode historique HTML5, vous n'avez pas besoin de l'inclure dans les props `to` des URLs. ### Props - **to** - - type: `string | Location` + - type : `string | Location` - - required - - Denotes the target route of the link. When clicked, the value of the `to` prop will be passed to `router.push()` internally, so the value can be either a string or a location descriptor object. + - requis + Désigne la route cible du lien. Lorsqu'il est cliqué, la valeur de la prop `to` va être passé de manière interne à `router.push`, donc la valeur peut soit être une chaîne de caractères, ou alors un objet décrivant une localisation. + ``` html - - Home - - Home + + Accueil + + Accueil - - Home + + Accueil - - Home + + Accueil - - Home + + Accueil - - User + + Utilisateur - - Register + + S'enregistrer ``` - **replace** - - type: `boolean` + - type : `boolean` - - default: `false` + - défaut : `false` - Setting `replace` prop will call `router.replace()` instead of `router.push()` when clicked, so the navigation will not leave a history record. + Configurer la prop `replace` appellera `router.replace()` au lieu de `router.push()` lors du clic, comme ça, la navigation ne laissera pas un enregistrement dans l'historique. ``` html @@ -56,78 +56,78 @@ - **append** - - type: `boolean` - - - default: `false` + - type : `boolean` - Setting `append` prop always appends the relative path to the current path. For example, assuming we are navigating from `/a` to a relative link `b`, without `append` we will end up at `/b`, but with `append` we will end up at `/a/b`. + - défaut : `false` + Configurer la propriété `append` suffixe toujours le chemin relatif au chemin courant. Par exemple, assumons que nous naviguons de `/a` à un lien relatif `b`, sans `append` on finira sur `/b`, mais avec `append` on finira sur `/a/b`. + ``` html ``` - **tag** - - type: `string` + - type : `string` - - default: `"a"` + - défaut : `"a"` - Sometimes we want `` to render as another tag, e.g `
  • `. Then we can use `tag` prop to specify which tag to render to, and it will still listen to click events for navigation. + Parfois, on veut que `` soit rendu avec un tag différent, ex : `
  • `. On peut alors utiliser la prop `tag` pour modifier le tag qui sera rendu, et il écoutera toujours aux événements de clic pour la navigation ``` html foo - +
  • foo
    • ``` - **active-class** - - type: `string` + - type : `string` - - default: `"router-link-active"` + - défaut : `"router-link-active"` - Configure the active CSS class applied when the link is active. Note the default value can also be configured globally via the `linkActiveClass` router constructor option. + Configure la classe CSS active qui sera appliquée lorsque le lien sera actif. Notez que la valeur par défaut peut aussi être configurée de manière globale via l'option `linkActiveClass` du constructeur du routeur. - **exact** - - type: `boolean` + - type : `boolean` - - default: `false` + - défaut : `false` - The default active class matching behavior is **inclusive match**. For example, `` will get this class applied as long as the current path starts with `/a/` or is `/a`. + Le comportement par défaut de la correspondance de classe active est une **correspondance inclusive**. Par exemple, `` vera cette classe appliquée tant que le chemin courant commencera par `/a/` ou `/a`. - One consequence of this is that `` will be active for every route! To force the link into "exact match mode", use the `exact` prop: + Une conséquence de cela est que `` sera actif pour toutes les routes ! Pour forcer le lien dans un "mode correspondance exacte", utilisez la prop `exact`. ``` html - + ``` - - Checkout more examples explaining active link class [live](https://jsfiddle.net/8xrk1n9f/). + + Allez voir les exemples expliquant la classe active pour les liens [ici](https://jsfiddle.net/8xrk1n9f/). - **event** > 2.1.0+ - - type: `string | Array` + - type : `string | Array` - - default: `'click'` + - défaut : `'click'` - Specify the event(s) that can trigger the link navigation. + Spécifie les événement(s) que peuvent lancer la navigation de lien. - **exact-active-class** > 2.5.0+ - - type: `string` + - type : `string` - - default: `"router-link-exact-active"` + - défaut : `"router-link-exact-active"` - Configure the active CSS class applied when the link is active with exact match. Note the default value can also be configured globally via the `linkExactActiveClass` router constructor option. + Configure la classe CSS active qui sera appliquée lorsqu'un lien sera actif avec une correspondance exact. Notez que la valeur par défaut peut aussi être configurée de manière globale via l'option `linkExactActiveClass` du constructeur du routeur. -### Applying Active Class to Outer Element +### Appliquer la classe active à l'élément extérieur -Sometimes we may want the active class to be applied to an outer element rather than the `` tag itself, in that case, you can render that outer element using `` and wrap the raw `` tag inside: +Parfois, on voudrait que la classe active soit appliquer à un élément extérieur au lieu de l'élément `` lui-même, dans ce cas, vous pouvez faire le rendu de cet élément extérieur en utilisant `` et en entourant le tag `` : ``` html @@ -135,4 +135,4 @@ Sometimes we may want the active class to be applied to an outer element rather ``` -In this case the `` will be the actual link (and will get the correct `href`), but the active class will be applied to the outer `
  • `. +Dans ce cas, `` sera le lien actuel (et récupérera le bon `href`), mais la classe active sera appliquée à l'élément extérieur `
  • `. From d1054a6422f73e9b061210a3234b023ce0e5ec87 Mon Sep 17 00:00:00 2001 From: Hugo Alliaume Date: Wed, 24 May 2017 16:31:33 +0200 Subject: [PATCH 21/90] Traduction de `advanced/lazy-loading.md` --- docs/en/SUMMARY.md | 2 +- docs/en/advanced/lazy-loading.md | 23 +++++++++++------------ 2 files changed, 12 insertions(+), 13 deletions(-) diff --git a/docs/en/SUMMARY.md b/docs/en/SUMMARY.md index b318f5244..72bb1c57b 100644 --- a/docs/en/SUMMARY.md +++ b/docs/en/SUMMARY.md @@ -21,7 +21,7 @@ - [Transitions (En)](advanced/transitions.md) - [Data Fetching (En)](advanced/data-fetching.md) - [Scroll Behavior (En)](advanced/scroll-behavior.md) - - [Lazy Loading (En)](advanced/lazy-loading.md) + - [Le chargement à la volée](advanced/lazy-loading.md) - Réference de l'API - [router-link (En)](api/router-link.md) - [router-view (En)](api/router-view.md) diff --git a/docs/en/advanced/lazy-loading.md b/docs/en/advanced/lazy-loading.md index f79b4fc8f..f32d8be7d 100644 --- a/docs/en/advanced/lazy-loading.md +++ b/docs/en/advanced/lazy-loading.md @@ -1,28 +1,27 @@ -# Lazy Loading Routes (En)

    *Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-router).* +# Les Routes chargeant à la volée -When building apps with a bundler, the JavaScript bundle can become quite large, and thus affect the page load time. It would be more efficient if we can split each route's components into a separate chunk, and only load them when the route is visited. +Pendant la construction d'applications avec un « bundler », le paquet JavaScript peut devenir un peut lourd, et donc cela peut affecter le temps de chargement de page. Il serait plus efficace si l'on pouvait séparer chaque composants de route dans des fragments séparés, et de ne les charger uniquement lorsque la route est visitée. -Combining Vue's [async component feature](http://vuejs.org/guide/components.html#Async-Components) and Webpack's [code splitting feature](https://webpack.js.org/guides/code-splitting-require/), it's trivially easy to -lazy-load route components. - -All we need to do is define our route components as async components: +En combinant la [fonctionnalité de composant asynchrone](http://vuejs.org/guide/components.html#Async-Components) de Vue et la [fonctionnalité de séparation de code](https://webpack.js.org/guides/code-splitting-require/) de Webpack, il est très facile de charger à la volée les composants de route. + +Tout ce dont nous avons à faire, c'est de définir les composants de notre route en tant que composants asynchrones : ``` js const Foo = resolve => { - // require.ensure is Webpack's special syntax for a code-split point. + // require.ensure est une syntaxe spéciale de Webpack pour une séparation de code. require.ensure(['./Foo.vue'], () => { resolve(require('./Foo.vue')) }) } ``` -There's also an alternative code-split syntax using AMD style require, so this can be simplified to: +Il y a aussi une alternative à la syntaxe de séparation de code utilisant l'inclusion à la sauce AMD, cela peut être simplifié en : ``` js const Foo = resolve => require(['./Foo.vue'], resolve) ``` -Nothing needs to change in the route config, just use `Foo` as usual: +Rien n'a besoin d'être modifié dans la configuration de la route, utilisez `Foo` comme d'habitude. ``` js const router = new VueRouter({ @@ -32,9 +31,9 @@ const router = new VueRouter({ }) ``` -### Grouping Components in the Same Chunk +### Grouper des composants dans le même morceau -Sometimes we may want to group all the components nested under the same route into the same async chunk. To achieve that we need to use [named chunks](https://webpack.js.org/guides/code-splitting-require/#chunkname) by providing a chunk name to `require.ensure` as the 3rd argument: +Parfois on aimerait grouper tous les composants imbriqués sous la même route, dans un seul et même morceau asynchrone. Pour arriver à cela, nous avons besoin d'utiliser les [morceaux nommés](https://webpack.js.org/guides/code-splitting-require/#chunkname) en donnant un nom au morceau en 3ème argument de `require.ensure`. ``` js const Foo = r => require.ensure([], () => r(require('./Foo.vue')), 'group-foo') @@ -42,4 +41,4 @@ const Bar = r => require.ensure([], () => r(require('./Bar.vue')), 'group-foo') const Baz = r => require.ensure([], () => r(require('./Baz.vue')), 'group-foo') ``` -Webpack will group any async module with the same chunk name into the same async chunk - this also means we don't need to explicitly list dependencies for `require.ensure` anymore (thus passing an empty array). +Webpack groupera tous les modules asynchrones avec le même nom de morceau, dans le même morceau asynchrone — cela signifie aussi que nous n'avons plus besoin de lister explicitement les dépendances pour `require.ensure` (équivaut à passer un tableau vide). From ff227d9b6c3821bb730eeec8bb3aba5d96a3881f Mon Sep 17 00:00:00 2001 From: Hugo Alliaume Date: Wed, 24 May 2017 23:33:28 +0200 Subject: [PATCH 22/90] Traduction de `advanced/scroll-behavior.md` --- docs/en/SUMMARY.md | 2 +- docs/en/advanced/scroll-behavior.md | 30 ++++++++++++++--------------- 2 files changed, 16 insertions(+), 16 deletions(-) diff --git a/docs/en/SUMMARY.md b/docs/en/SUMMARY.md index b318f5244..fd6ae1e31 100644 --- a/docs/en/SUMMARY.md +++ b/docs/en/SUMMARY.md @@ -20,7 +20,7 @@ - [Route Meta Fields (En)](advanced/meta.md) - [Transitions (En)](advanced/transitions.md) - [Data Fetching (En)](advanced/data-fetching.md) - - [Scroll Behavior (En)](advanced/scroll-behavior.md) + - [Comportement du défilement](advanced/scroll-behavior.md) - [Lazy Loading (En)](advanced/lazy-loading.md) - Réference de l'API - [router-link (En)](api/router-link.md) diff --git a/docs/en/advanced/scroll-behavior.md b/docs/en/advanced/scroll-behavior.md index c600df87d..967afed2a 100644 --- a/docs/en/advanced/scroll-behavior.md +++ b/docs/en/advanced/scroll-behavior.md @@ -1,30 +1,30 @@ -# Scroll Behavior (En)

    *Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-router).* +# Comportement du défilement -When using client-side routing, we may want to scroll to top when navigating to a new route, or preserve the scrolling position of history entries just like real page reload does. `vue-router` allows you to achieve these and even better, allows you to completely customize the scroll behavior on route navigation. +En utilisant le routage côté client, nous pourrions vouloir défiler jusqu'au haut de la page lorsqu'on navigue à une nouvelle route, ou alors préserver la position du défilement des entrées de l'historique comme le ferait une page réelle. `vue-router` vous permet de faire cela et en mieux, ainsi que de changer le comportement du défilement pendant la navigation. -**Note: this feature only works in HTML5 history mode.** +**Note : cette fonctionnalité ne fonctionne qu'avec le mode historique HTML5.** -When creating the router instance, you can provide the `scrollBehavior` function: +Pendant la création de l'instance du routeur, vous pouvez renseigner la fonction `scrollBehavior` : ``` js const router = new VueRouter({ routes: [...], scrollBehavior (to, from, savedPosition) { - // return desired position + // retourne la position désirée } }) ``` -The `scrollBehavior` function receives the `to` and `from` route objects. The third argument, `savedPosition`, is only available if this is a `popstate` navigation (triggered by the browser's back/forward buttons). +La fonction `scrollBehavior` reçoit les objets de route `to` et `from`. Le troisième argument, `savedPosition`, est disponible uniquement si c'est une navigation `popstate` (déclenchée par les boutons précédent/suivant du navigateur). -The function can return a scroll position object. The object could be in the form of: +La fonction peut retourner un objet décrivant la position du défilement. L'objet peut être de la forme : -- `{ x: number, y: number }` -- `{ selector: string }` +- `{ x: Number, y: Number }` +- `{ selector: String }` -If a falsy value or an empty object is returned, no scrolling will happen. +Si une valeur équivalente à `false` ou un objet vide est retourné, aucun défilement ne sera produit. -For example: +Par exemple : ``` js scrollBehavior (to, from, savedPosition) { @@ -32,9 +32,9 @@ scrollBehavior (to, from, savedPosition) { } ``` -This will simply make the page scroll to top for all route navigations. +Cela permettra de défiler jusqu'au haut de page à chaque navigation à travers les routes. -Returning the `savedPosition` will result in a native-like behavior when navigating with back/forward buttons: +Retourner l'objet `savedPosition` résultera en un comportement quasi-natif en naviguant avec les boutons précédents/suivants : ``` js scrollBehavior (to, from, savedPosition) { @@ -46,7 +46,7 @@ scrollBehavior (to, from, savedPosition) { } ``` -If you want to simulate the "scroll to anchor" behavior: +Si vous voulez simuler le comportement "défiler à l'ancre" : ``` js scrollBehavior (to, from, savedPosition) { @@ -58,4 +58,4 @@ scrollBehavior (to, from, savedPosition) { } ``` -We can also use [route meta fields](meta.md) to implement fine-grained scroll behavior control. Check out a full example [here](https://github.com/vuejs/vue-router/blob/dev/examples/scroll-behavior/app.js). +On peut aussi utiliser les [champs meta de route](meta.md) pour implémenter un contrôle bien précis pour le comportement du défilement. Allez voir un exemple complet [ici](https://github.com/vuejs/vue-router/blob/dev/examples/scroll-behavior/app.js). From 3684a6de5c70616e5d22894735607f4bfef767fd Mon Sep 17 00:00:00 2001 From: Hugo Alliaume Date: Fri, 26 May 2017 06:18:26 +0200 Subject: [PATCH 23/90] Traduction de `advanced/data-fetching.md` --- docs/en/SUMMARY.md | 2 +- docs/en/advanced/data-fetching.md | 37 +++++++++++++++---------------- 2 files changed, 19 insertions(+), 20 deletions(-) diff --git a/docs/en/SUMMARY.md b/docs/en/SUMMARY.md index b318f5244..7d40c1f78 100644 --- a/docs/en/SUMMARY.md +++ b/docs/en/SUMMARY.md @@ -19,7 +19,7 @@ - [Navigation Guards (En)](advanced/navigation-guards.md) - [Route Meta Fields (En)](advanced/meta.md) - [Transitions (En)](advanced/transitions.md) - - [Data Fetching (En)](advanced/data-fetching.md) + - [La récupération de données](advanced/data-fetching.md) - [Scroll Behavior (En)](advanced/scroll-behavior.md) - [Lazy Loading (En)](advanced/lazy-loading.md) - Réference de l'API diff --git a/docs/en/advanced/data-fetching.md b/docs/en/advanced/data-fetching.md index 4a4b82807..52bab29b0 100644 --- a/docs/en/advanced/data-fetching.md +++ b/docs/en/advanced/data-fetching.md @@ -1,24 +1,24 @@ -# Data Fetching (En)

    *Cette page est en cours de traduction française. Revenez une autre fois pour lire une traduction achevée ou [participez à la traduction française ici](https://github.com/vuejs-fr/vue-router).* +# La récupération de données -Sometimes you need to fetch data from the server when a route is activated. For example, before rendering a user profile, you need to fetch the user's data from the server. We can achieve this in two different ways: +Parfois vous avez besoin de récupérer des données depuis le serveur lorsqu'une route est activée. Par exemple, avant de faire le rendu d'un profil utilisateur, vous avez besoin de récupérer les données de l'utilisateur depuis le serveur. Nous pouvons y parvenir de deux façons différentes : -- **Fetching After Navigation**: perform the navigation first, and fetch data in the incoming component's lifecycle hook. Display a loading state while data is being fetched. +- **Récupération de donnée après la navigation** : effectue la navigation en premier, et récupère les données dans le hook entrant du cycle de vie d'un composant. Affiche un état de chargement pendant que les données sont en train d'être récupérées. -- **Fetching Before Navigation**: Fetch data before navigation in the route enter guard, and perform the navigation after data has been fetched. +- **Récupération de donnée avant la navigation** : récupère les données avant la navigation dans la fonction de garde d'entrée de la route, et effectue la navigation après que les données aient été récupérées. -Technically, both are valid choices - it ultimately depends on the user experience you are aiming for. +Techniquement, les deux choix sont valides — cela dépend de l'expérience utilisateur que vous souhaitez apporter. -## Fetching After Navigation +## Récupération de données après la navigation -When using this approach, we navigate and render the incoming component immediately, and fetch data in the component's `created` hook. It gives us the opportunity to display a loading state while the data is being fetched over the network, and we can also handle loading differently for each view. +En utilisant cette approche, nous naviguons et faisons immédiatement le rendu du composant, et récupère les données via le hook `created` du composant. Cela nous donne l'opportunité d'afficher un état de chargement pendant ques les données sont récupérées à travers le réseau, et nous pouvons aussi gérer le chargement différemment pour chaque vue. -Let's assume we have a `Post` component that needs to fetch the data for a post based on `$route.params.id`: +Assumons que nous ayons un composant `Post` qui a besoin de récupérer des données pour un post identifié par `$route.params.id` : ``` html