docs(fr): component discovery (#1960)

content/fr/docs/3.features/9.component-discovery.md

@@ -1,14 +1,14 @@
 ---
-title: Component Discovery
-description: By default, Nuxt is configured to cover most use cases. This default configuration can be overwritten with the nuxt.config.js file.
+title: Découverte automatique des composants
+description: Nuxt est capable d'importer automatiquement les composants utilisés dans un template.
 category: features
 img: /docs/components.png
 imgAlt: nuxt components module
 ---
 
-## Enabling Auto-Discovery
+## Activer la découverte automatique (auto-discovery)
 
-Starting from `v2.13`, Nuxt can auto import your components when used in your templates. To activate this feature, set `components: true` in your configuration:
+Depuis la version `v2.13`, Nuxt est capable d'importer automatiquement les composants utilisés dans un template. Pour activer cette fonctionnalité, ajoutez `components: true` dans la configuration globable de votre projet Nuxt.
 
 ```js{}[nuxt.config.js]
 export default {
@@ -17,12 +17,12 @@ export default {
 ```
 
 ::alert{type="info"}
-Check out [how to configure component auto-discovery](/docs/configuration-glossary/configuration-components#advanced).
+Pour en savoir plus, consultez [la documentation de configuration de la découverte automatique (auto-discovery)](/fr/docs/configuration-glossary/configuration-components#advanced).
 ::
 
-## Using Components
+## Utiliser les composants
 
-Once you create your components in the components directory they will then be available throughout your app without the need to import them.
+Une fois les composants créés dans le dossier `/components`, ils seront directement accessibles depuis n'importe quelle partie de l'application. Ils sont utilisables sans avoir à les importer.
 
 ```bash
 | components/
@@ -41,12 +41,12 @@ Once you create your components in the components directory they will then be av
 ```
 
 ::alert{type="info"}
-See [live demo](https://codesandbox.io/s/nuxt-components-cou9k) or [video example](https://www.youtube.com/watch?v=lQ8OBrgVVr8).
+Plus d'exemples sur la [démo CodeSandbox](https://codesandbox.io/s/nuxt-components-cou9k) ou sur la [vidéo d'exemple](https://www.youtube.com/watch?v=lQ8OBrgVVr8).
 ::
 
-## Component Names
+## Noms des composants
 
-If you have components in nested directories such as:
+Si les composants sont imbriqués dans des dossiers, comme ici :
 
 ```bash
 | components/
@@ -55,17 +55,18 @@ If you have components in nested directories such as:
 ------| Button.vue
 ```
 
-The component name will be based on its own path directory and filename. Therefore, the component will be:
+Le nom du composant sera déduit du nom du fichier dans lequel il se trouve et préfixé par le ou les noms des dossiers parents.
+Avec l'exemple plus haut, le nom du composant sera :
 
 ```html
 <BaseFooButton />
 ```
 
 ::alert
-For clarity, it is recommend that the component file name matches its name. (So, in the example above, you could rename `Button.vue` to be `BaseFooButton.vue`.)
+Pour plus de clarté, il est recommandé que le composant ait le même nom que le fichier dans lequel il se trouve. Dans l'exemple plus haut, il faut renommer `Button.vue` en `BaseFooButton.vue`.
 ::
 
-If you want to use a custom directory structure that should not be part of the component name, you can explicitly specify these directories:
+Si vous voulez utiliser une structure de dossier personnalisée qui ne doit pas se refléter dans le nom du composant, il est possible de le spécifier explicitement dans la configuration globale du projet Nuxt :
 
 ```bash
 | components/
@@ -83,19 +84,19 @@ components: {
 }
 ```
 
-And now in your template you can use `FooButton` instead of `BaseFooButton`.
+Avec cette configuration, le nom du composant sera `FooButton` plutôt que `BaseFooButton`.
 
 ```html{}[pages/index.vue]
 <FooButton />
 ```
 
 ::alert{type="info"}
-Consider naming your components and directories following the [Vue Style Guide](https://vuejs.org/v2/style-guide/).
+Pensez à nommer vos composants en vous référant aux [conventions de Vue.js](https://fr.vuejs.org/v2/style-guide).
 ::
 
-## Dynamic Imports
+## Imports dynamiques
 
-To dynamically import a component (also known as lazy-loading a component) all you need to do is add the `Lazy` prefix to the component name.
+Pour importer un composant de façon dynamique (chargement différé ou lazy-loading), il suffit d'ajouter le préfixe `Lazy` au nom du composant.
 
 ```html{}[layouts/default.vue]
 <template>
@@ -107,7 +108,7 @@ To dynamically import a component (also known as lazy-loading a component) all y
 </template>
 ```
 
-This is particularly useful if the component is not always needed. By using the `Lazy` prefix you can delay delay loading the component code until the right moment, which can be helpful for optimizing your JavaScript bundle size.
+En utilisant le préfixe `Lazy`, le chargement du composant est différé en attendant le moment où il devient réellement nécessaire. C'est principalement utilisé pour optimiser la taille du bundle JavaScript.
 
 ```html{}[pages/index.vue]
 <template>
@@ -129,6 +130,4 @@ export default {
 </script>
 ```
 
-## Cheatsheet
-
 :modal{src="img" alt="imgAlt"}