From 3e8dc060d90b3d16ef1cd6dd2ae0c59d9232766d Mon Sep 17 00:00:00 2001 From: "locadex-agent[bot]" <217277504+locadex-agent[bot]@users.noreply.github.com> Date: Mon, 29 Sep 2025 20:56:34 +0000 Subject: [PATCH] docs(locadex): update translations --- es/code.mdx | 578 ++++++++++++++++++++++++++------------------------- fr/code.mdx | 584 +++++++++++++++++++++++++++------------------------- zh/code.mdx | 582 ++++++++++++++++++++++++++------------------------- 3 files changed, 905 insertions(+), 839 deletions(-) diff --git a/es/code.mdx b/es/code.mdx index bc11a5ba3..ee1fc9a5e 100644 --- a/es/code.mdx +++ b/es/code.mdx @@ -24,27 +24,29 @@ Para marcar una `palabra` o `frase` como código, enciérrala entre comillas inv ### Bloques de código -Usa [bloques de código con cercas](https://www.markdownguide.org/extended-syntax/#fenced-code-blocks) encerrando el código entre tres comillas invertidas (backticks). Los bloques de código se pueden copiar y, si tienes el assistant habilitado, los usuarios pueden pedirle a la IA que explique el código. - -Especifica el lenguaje de programación para el resaltado de sintaxis y para habilitar opciones meta. Agrega cualquier opción meta, como un Título o icon, después del lenguaje. - -```java HelloWorld.java lines icon="java" -class HelloWorld { - public static void main(String[] args) { - System.out.println("¡Hola, Mundo!"); - } -} -``` - -````mdx -```java HelloWorld.java lines icon="java" -class HelloWorld { - public static void main(String[] args) { - System.out.println("¡Hola, Mundo!"); - } -} -``` -```` +Usa [bloques de código cercados](https://www.markdownguide.org/extended-syntax/#fenced-code-blocks) encerrando el código entre tres acentos graves. Los bloques de código se pueden copiar y, si tienes el assistant activado, los usuarios pueden pedir a la IA que explique el código. + +Especifica el lenguaje de programación para el resaltado de sintaxis y para habilitar opciones meta. Agrega cualquier opción meta, como un title o icon, después del lenguaje. + + + ```java HelloWorld.java example lines icon="java" + class HelloWorld { + public static void main(String[] args) { + System.out.println("Hello, World!"); + } + } + ``` + + ````mdx Format + ```java HelloWorld.java lines icon="java" + class HelloWorld { + public static void main(String[] args) { + System.out.println("Hello, World!"); + } + } + ``` + ```` +
## Opciones de bloque de código @@ -67,73 +69,79 @@ Puedes añadir opciones de metadatos a tus bloques de código para personalizar ### Resaltado de sintaxis
-Activa el resaltado de sintaxis indicando el lenguaje de programación después de las comillas invertidas iniciales de un bloque de código. +Activa el resaltado de sintaxis especificando el lenguaje de programación después de las comillas invertidas de apertura de un bloque de código. Usamos [Shiki](https://shiki.style/) para el resaltado de sintaxis y admitimos todos los lenguajes disponibles. Consulta la lista completa de [lenguajes](https://shiki.style/languages) en la documentación de Shiki. -```java -class HelloWorld { - public static void main(String[] args) { - System.out.println("¡Hola, Mundo!"); - } -} -``` - -````mdx -```java -class HelloWorld { - public static void main(String[] args) { - System.out.println("¡Hola, Mundo!"); - } -} -``` -```` + + ```java Ejemplo de resaltado de sintaxis + class HelloWorld { + public static void main(String[] args) { + System.out.println("Hello, World!"); + } + } + ``` + + ````mdx Formato + ```java + class HelloWorld { + public static void main(String[] args) { + System.out.println("Hello, World!"); + } + } + ``` + ```` +
### Twoslash
-En los bloques de código de JavaScript y TypeScript, usa `twoslash` para habilitar información de tipos interactiva. Los usuarios pueden pasar el cursor sobre variables, funciones y parámetros para ver tipos y errores, como en un IDE. +En los bloques de código de JavaScript y TypeScript, usa `twoslash` para habilitar información de tipos interactiva. Los usuarios pueden pasar el cursor sobre variables, funciones y parámetros para ver tipos y errores como en un IDE. -```ts title="Twoslash Example" twoslash -type Pet = "cat" | "dog" | "hamster"; + + ```ts twoslash Ejemplo de Twoslash + type Pet = "cat" | "dog" | "hamster"; -function adoptPet(name: string, type: Pet) { - return `${name} el ${type} ya está adoptado!`; -} + function adoptPet(name: string, type: Pet) { + return `${name} the ${type} is now adopted!`; + } -// Pasa el cursor para ver los tipos inferidos -const message = adoptPet("Mintie", "cat"); -``` + // Pasa el cursor para ver los tipos inferidos + const message = adoptPet("Mintie", "cat"); + ``` -````mdx -```ts title="Ejemplo de Twoslash" twoslash -type Pet = "cat" | "dog" | "hamster"; + ````mdx Format + ```ts twoslash + type Pet = "cat" | "dog" | "hamster"; -function adoptPet(name: string, type: Pet) { - return `${name} the ${type} is now adopted! 🎉`; -} + function adoptPet(name: string, type: Pet) { + return `${name} the ${type} is now adopted!`; + } -// Pasa el cursor para ver los tipos inferidos -const message = adoptPet("Mintie", "cat"); -``` -```` + // Pasa el cursor para ver los tipos inferidos + const message = adoptPet("Mintie", "cat"); + ``` + ```` +
### Título
-Añade un título para identificar tu ejemplo de código. Usa `title="Your title"` o una cadena en una sola línea. +Añade un título para etiquetar tu ejemplo de código. Usa `title="Tu título"` o una cadena en una sola línea. -```javascript Code Block Example -const hello = "mundo"; -``` + + ```javascript Ejemplo de título + const hello = "world"; + ``` -````mdx -```javascript Ejemplo de Bloque de Código -const hello = "world"; -``` -```` + ````mdx Format + ```javascript Ejemplo de título + const hello = "world"; + ``` + ```` +
### Icono @@ -141,255 +149,269 @@ const hello = "world"; Agrega un icono a tu bloque de código usando la propiedad `icon`. Consulta [Iconos](/es/components/icons) para ver todas las opciones disponibles. -```javascript icon="square-js" -const hello = "mundo"; -``` + + ```javascript Ejemplo de icono icon="square-js" + const hello = "world"; + ``` -````mdx -```javascript icon="square-js" -const hello = "world"; -``` -```` + ````mdx Formato + ```javascript icon="square-js" + const hello = "world"; + ``` + ```` +
### Resaltado de líneas
-Resalta líneas específicas en tus bloques de código usando `highlight` con los números o rangos de líneas que deseas resaltar. - -```javascript Line Highlighting Example highlight= {1-2,5} -const greeting = "¡Hola, Mundo!"; -function sayHello() { - console.log(greeting); -} -sayHello(); -``` - -````mdx -```javascript Ejemplo de Resaltado de Líneas highlight={1-2,5} -const greeting = "Hello, World!"; -function sayHello() { - console.log(greeting); -} -sayHello(); -``` -```` +Resalta líneas específicas en tus bloques de código usando `highlight` con los números de línea o los rangos que quieras resaltar. + + + ```javascript Ejemplo de resaltado de líneas highlight={1-2,5} + const greeting = "Hello, World!"; + function sayHello() { + console.log(greeting); + } + sayHello(); + ``` + + ````mdx Formato + ```javascript highlight={1-2,5} + const greeting = "Hello, World!"; + function sayHello() { + console.log(greeting); + } + sayHello(); + ``` + ```` +
### Enfoque de líneas
-Enfoca líneas específicas en tus bloques de código usando `focus` con números de línea o rangos. - -```javascript Line Focus Example focus= {2,4-5} -const greeting = "¡Hola, Mundo!"; -function sayHello() { - console.log(greeting); -} -sayHello(); -``` - -````mdx -```javascript Ejemplo de Enfoque de Línea focus={2,4-5} -const greeting = "Hello, World!"; -function sayHello() { - console.log(greeting); -} -sayHello(); -``` -```` +Resalta líneas específicas en tus bloques de código usando `focus` con números de línea o rangos. + + + ```javascript Line focus example focus= {2,4-5} + const greeting = "Hello, World!"; + function sayHello() { + console.log(greeting); + } + sayHello(); + ``` + + ````mdx Format + ```javascript focus={2,4-5} + const greeting = "Hello, World!"; + function sayHello() { + console.log(greeting); + } + sayHello(); + ``` + ```` +
### Mostrar números de línea
-Muestra los números de línea en el lado izquierdo de tu bloque de código con `lines`. - -```javascript Show Line Numbers Example lines -const greeting = "¡Hola, Mundo!"; -function sayHello() { - console.log(greeting); -} -sayHello(); -``` - -````mdx -```javascript Mostrar números de línea Ejemplo -const greeting = "Hello, World!"; -function sayHello() { - console.log(greeting); -} -sayHello(); -``` -```` +Muestra los números de línea en el lado izquierdo de tu bloque de código usando `lines`. + + + ```javascript Ejemplo de números de línea lines + const greeting = "Hello, World!"; + function sayHello() { + console.log(greeting); + } + sayHello(); + ``` + + ````mdx Format + ```javascript lines + const greeting = "Hello, World!"; + function sayHello() { + console.log(greeting); + } + sayHello(); + ``` + ```` +
### Expandible
-Permite que los usuarios expandan y contraigan bloques de código largos con `expandable`. - -```python Expandable Example expandable -from datetime import datetime, timedelta -from typing import Dict, List, Optional -from dataclasses import dataclass - -@dataclass -class Book: - title: str - author: str - isbn: str - checked_out: bool = False - due_date: Optional[datetime] = None - -class Library: - def __init__(self): - self.books: Dict[str, Book] = {} - self.checkouts: Dict[str, List[str]] = {} # patron -> list of ISBNs - - def add_book(self, book: Book) -> None: - if book.isbn in self.books: - raise ValueError(f"El libro con ISBN {book.isbn} ya existe") - self.books[book.isbn] = book - - def checkout_book(self, isbn: str, patron: str, days: int = 14) -> None: - if patron not in self.checkouts: - self.checkouts[patron] = [] - - book = self.books.get(isbn) - if not book: - raise ValueError("Libro no encontrado") - - if book.checked_out: - raise ValueError("El libro ya está prestado") - - if len(self.checkouts[patron]) >= 3: - raise ValueError("El usuario ha alcanzado el límite de préstamos") - - book.checked_out = True - book.due_date = datetime.now() + timedelta(days=days) - self.checkouts[patron].append(isbn) - - def return_book(self, isbn: str) -> float: - book = self.books.get(isbn) - if not book or not book.checked_out: - raise ValueError("Libro no encontrado o no está prestado") - - late_fee = 0.0 - if datetime.now() > book.due_date: - days_late = (datetime.now() - book.due_date).days - late_fee = days_late * 0.50 - - book.checked_out = False - book.due_date = None - - # Eliminar de los préstamos del usuario - for patron, books in self.checkouts.items(): - if isbn in books: - books.remove(isbn) - break - - return late_fee - - def search(self, query: str) -> List[Book]: - query = query.lower() - return [ - book for book in self.books.values() - if query in book.title.lower() or query in book.author.lower() - ] - -def main(): - library = Library() - - # Agregar algunos libros - books = [ - Book("The Hobbit", "J.R.R. Tolkien", "978-0-261-10295-4"), - Book("1984", "George Orwell", "978-0-452-28423-4"), - ] - - for book in books: - library.add_book(book) - - # Ejemplo de préstamo y devolución - library.checkout_book("978-0-261-10295-4", "patron123") - late_fee = library.return_book("978-0-261-10295-4") - print(f"Multa por retraso: ${late_fee:.2f}") - -if __name__ == "__main__": - main() -``` - -````mdx -```python Ejemplo Expandible expandable -from datetime import datetime, timedelta -from typing import Dict, List, Optional -from dataclasses import dataclass - -# ... - -if __name__ == "__main__": - main() -``` -```` +Permite que los usuarios expandan y contraigan bloques de código largos usando `expandable`. + + + ```python Expandable example expandable + from datetime import datetime, timedelta + from typing import Dict, List, Optional + from dataclasses import dataclass + + @dataclass + class Book: + title: str + author: str + isbn: str + checked_out: bool = False + due_date: Optional[datetime] = None + + class Library: + def __init__(self): + self.books: Dict[str, Book] = {} + self.checkouts: Dict[str, List[str]] = {} # patron -> list of ISBNs + + def add_book(self, book: Book) -> None: + if book.isbn in self.books: + raise ValueError(f"Book with ISBN {book.isbn} already exists") + self.books[book.isbn] = book + + def checkout_book(self, isbn: str, patron: str, days: int = 14) -> None: + if patron not in self.checkouts: + self.checkouts[patron] = [] + + book = self.books.get(isbn) + if not book: + raise ValueError("Book not found") + + if book.checked_out: + raise ValueError("Book is already checked out") + + if len(self.checkouts[patron]) >= 3: + raise ValueError("Patron has reached checkout limit") + + book.checked_out = True + book.due_date = datetime.now() + timedelta(days=days) + self.checkouts[patron].append(isbn) + + def return_book(self, isbn: str) -> float: + book = self.books.get(isbn) + if not book or not book.checked_out: + raise ValueError("Book not found or not checked out") + + late_fee = 0.0 + if datetime.now() > book.due_date: + days_late = (datetime.now() - book.due_date).days + late_fee = days_late * 0.50 + + book.checked_out = False + book.due_date = None + + # Remove from patron's checkouts + for patron, books in self.checkouts.items(): + if isbn in books: + books.remove(isbn) + break + + return late_fee + + def search(self, query: str) -> List[Book]: + query = query.lower() + return [ + book for book in self.books.values() + if query in book.title.lower() or query in book.author.lower() + ] + + def main(): + library = Library() + + # Add some books + books = [ + Book("The Hobbit", "J.R.R. Tolkien", "978-0-261-10295-4"), + Book("1984", "George Orwell", "978-0-452-28423-4"), + ] + + for book in books: + library.add_book(book) + + # Checkout and return example + library.checkout_book("978-0-261-10295-4", "patron123") + late_fee = library.return_book("978-0-261-10295-4") + print(f"Late fee: ${late_fee:.2f}") + + if __name__ == "__main__": + main() + ``` + + ````text Format + ```python expandable + from datetime import datetime, timedelta + from typing import Dict, List, Optional + from dataclasses import dataclass + + # ... + + if __name__ == "__main__": + main() + ``` + ```` +
### Ajuste
-Activa el ajuste de texto para líneas largas con `wrap`. Esto evita el desplazamiento horizontal y facilita la lectura de líneas extensas. - -```javascript Wrap Example wrap -const greeting = "¡Hola, Mundo! Soy una línea larga de texto que se ajustará a la siguiente línea."; -function sayHello() { - console.log(greeting); -} -sayHello(); -``` - -````mdx -```javascript Ejemplo de Ajuste wrap -const greeting = "¡Hola, Mundo! Soy una línea larga de texto que se ajustará a la siguiente línea."; -function sayHello() { - console.log(greeting); -} -sayHello(); -``` -```` +Activa el ajuste de texto para líneas largas usando `wrap`. Esto evita el desplazamiento horizontal y facilita la lectura de líneas extensas. + + + ```javascript Wrap example wrap + const greeting = "Hello, World! I am a long line of text that will wrap to the next line."; + function sayHello() { + console.log(greeting); + } + sayHello(); + ``` + + ````mdx Format + ```javascript wrap + const greeting = "Hello, World! I am a long line of text that will wrap to the next line."; + function sayHello() { + console.log(greeting); + } + sayHello(); + ``` + ```` +
### Diff
-Muestra un diff visual de las líneas añadidas o eliminadas en tus bloques de código. Las líneas añadidas se resaltan en verde y las eliminadas en rojo. +Muestra un diff visual de las líneas añadidas o eliminadas en tus bloques de código. Las líneas añadidas se resaltan en verde y las eliminadas se resaltan en rojo. -Para crear diffs, añade estos comentarios especiales al final de las líneas en tu bloque de código: +Para crear diffs, agrega estos comentarios especiales al final de las líneas en tu bloque de código: * `// [!code ++]`: Marca una línea como añadida (resaltado en verde). * `// [!code --]`: Marca una línea como eliminada (resaltado en rojo). Para varias líneas consecutivas, especifica el número de líneas después de dos puntos: -* `// [!code ++:3]`: Marca la línea actual más las dos siguientes como añadidas. -* `// [!code --:5]`: Marca la línea actual más las cuatro siguientes como eliminadas. +* `// [!code ++:3]`: Marca la línea actual y las dos siguientes como añadidas. +* `// [!code --:5]`: Marca la línea actual y las cuatro siguientes como eliminadas. La sintaxis del comentario debe coincidir con tu lenguaje de programación (por ejemplo, `//` para JavaScript o `#` para Python). -```js Diff Example icon="code" lines -const greeting = "¡Hola, Mundo!"; // [!code ++] -function sayHello() { - console.log("¡Hola, Mundo!"); // [!code --] - console.log(greeting); // [!code ++] -} -sayHello(); -``` - -````text -```js Ejemplo de Diff icon="code" lines -const greeting = "Hello, World!"; // [!code ++] -function sayHello() { - console.log("Hello, World!"); // [!code --] - console.log(greeting); // [!code ++] -} -sayHello(); -``` -```` + + ```js Diff example lines + const greeting = "Hello, World!"; // [!code ++] + function sayHello() { + console.log("Hello, World!"); // [!code --] + console.log(greeting); // [!code ++] + } + sayHello(); + ``` + + ````text Format + ```js lines + const greeting = "Hello, World!"; // [!code ++] + function sayHello() { + console.log("Hello, World!"); // [!code --] + console.log(greeting); // [!code ++] + } + sayHello(); + ``` + ```` + \ No newline at end of file diff --git a/fr/code.mdx b/fr/code.mdx index bbc2d8394..bbe685dc1 100644 --- a/fr/code.mdx +++ b/fr/code.mdx @@ -21,30 +21,32 @@ Pour désigner un `mot` ou une `phrase` comme du code, entourez-le de backticks ```
- ### Code blocks + ### Blocs de code
-Utilisez des [fenced code blocks](https://www.markdownguide.org/extended-syntax/#fenced-code-blocks) en entourant le code de trois backticks. Les code blocks sont copiables et, si vous avez activé l’Assistant, les utilisateurs peuvent demander à l’IA d’expliquer le code. - -Indiquez le langage de programmation pour la coloration syntaxique et pour activer les options méta. Ajoutez toutes les options méta, comme un title ou un icon, après le langage. - -```java HelloWorld.java lines icon="java" -class HelloWorld { - public static void main(String[] args) { - System.out.println("Bonjour, monde !"); - } -} -``` - -````mdx -```java HelloWorld.java lines icon="java" -class HelloWorld { - public static void main(String[] args) { - System.out.println("Bonjour le monde !"); - } -} -``` -```` +Utilisez des [blocs de code délimités](https://www.markdownguide.org/extended-syntax/#fenced-code-blocks) en encadrant le code de trois accents graves. Les blocs de code sont copiables et, si vous avez activé l’Assistant, les utilisateurs peuvent demander à l’IA d’expliquer le code. + +Indiquez le langage de programmation pour la coloration syntaxique et pour activer les options méta. Ajoutez les options méta, comme un title ou un icon, après le langage. + + + ```java HelloWorld.java example lines icon="java" + class HelloWorld { + public static void main(String[] args) { + System.out.println("Hello, World!"); + } + } + ``` + + ````mdx Format + ```java HelloWorld.java lines icon="java" + class HelloWorld { + public static void main(String[] args) { + System.out.println("Hello, World!"); + } + } + ``` + ```` +
## Options de code block @@ -71,325 +73,345 @@ Activez la coloration syntaxique en indiquant le langage de programmation après Nous utilisons [Shiki](https://shiki.style/) pour la coloration syntaxique et prenons en charge tous les langages disponibles. Consultez la liste complète des [langages](https://shiki.style/languages) dans la documentation de Shiki. -```java -class HelloWorld { - public static void main(String[] args) { - System.out.println("Bonjour, monde !"); - } -} -``` - -````mdx -```java -class HelloWorld { - public static void main(String[] args) { - System.out.println("Bonjour, le monde !"); - } -} -``` -```` + + ```java Exemple de coloration syntaxique + class HelloWorld { + public static void main(String[] args) { + System.out.println("Hello, World!"); + } + } + ``` + + ````mdx Format + ```java + class HelloWorld { + public static void main(String[] args) { + System.out.println("Hello, World!"); + } + } + ``` + ```` +
### Twoslash
-Dans les code blocks JavaScript et TypeScript, utilisez `twoslash` pour afficher des informations de type interactives. Les utilisateurs peuvent survoler des variables, des fonctions et des paramètres pour consulter les types et les erreurs, comme dans un IDE. +Dans les code blocks JavaScript et TypeScript, utilisez `twoslash` pour activer des informations de types interactives. Les utilisateurs peuvent survoler les variables, fonctions et paramètres pour voir les types et les erreurs comme dans un IDE. -```ts title="Twoslash Example" twoslash -type Pet = "cat" | "dog" | "hamster"; + + ```ts twoslash Exemple Twoslash + type Pet = "cat" | "dog" | "hamster"; -function adoptPet(name: string, type: Pet) { - return `${name} le ${type} est maintenant adopté !`; -} + function adoptPet(name: string, type: Pet) { + return `${name} the ${type} is now adopted!`; + } -// Survolez pour voir les types inférés -const message = adoptPet("Mintie", "cat"); -``` + // Survolez pour voir les types inférés + const message = adoptPet("Mintie", "cat"); + ``` -````mdx -```ts title="Exemple Twoslash" twoslash -type Pet = "cat" | "dog" | "hamster"; + ````mdx Format + ```ts twoslash + type Pet = "cat" | "dog" | "hamster"; -function adoptPet(name: string, type: Pet) { - return `${name} the ${type} is now adopted! 🎉`; -} + function adoptPet(name: string, type: Pet) { + return `${name} the ${type} is now adopted!`; + } -// Survolez pour voir les types inférés -const message = adoptPet("Mintie", "cat"); -``` -```` + // Survolez pour voir les types inférés + const message = adoptPet("Mintie", "cat"); + ``` + ```` +
### Titre
-Ajoutez un titre pour identifier votre exemple de code. Utilisez `title="Your title"` ou une chaîne sur une seule ligne. +Ajoutez un titre pour indiquer votre exemple de code. Utilisez `title="Votre titre"` ou une chaîne sur une seule ligne. -```javascript Code Block Example -const hello = "monde"; -``` + + ```javascript Exemple de titre + const hello = "world"; + ``` -````mdx -```javascript Exemple de bloc de code -const hello = "world"; -``` -```` + ````mdx Format + ```javascript Exemple de titre + const hello = "world"; + ``` + ```` +
### Icône
-Ajoutez un icon à votre code block à l'aide de la propriété `icon`. Voir [Icônes](/fr/components/icons) pour toutes les options disponibles. +Ajoutez une icône à votre code block à l’aide de la propriété `icon`. Consultez [Icônes](/fr/components/icons) pour connaître toutes les options disponibles. -```javascript icon="square-js" -const hello = "monde"; -``` + + ```javascript Exemple d’icône icon="square-js" + const hello = "world"; + ``` -````mdx -```javascript icon="square-js" -const hello = "world"; -``` -```` + ````mdx Format + ```javascript icon="square-js" + const hello = "world"; + ``` + ```` +
### Surlignage de lignes
-Mettez en surbrillance des lignes spécifiques dans vos code blocks en utilisant `highlight` avec les numéros de lignes ou les plages que vous souhaitez mettre en évidence. - -```javascript Line Highlighting Example highlight= {1-2,5} -const greeting = "Bonjour, le monde !"; -function sayHello() { - console.log(greeting); -} -sayHello(); -``` - -````mdx -```javascript Exemple de mise en évidence de lignes highlight={1-2,5} -const greeting = "Hello, World!"; -function sayHello() { - console.log(greeting); -} -sayHello(); -``` -```` +Mettez en surbrillance des lignes spécifiques dans vos code blocks en utilisant `highlight` avec les numéros de ligne ou les plages que vous souhaitez mettre en évidence. + + + ```javascript Line highlighting example highlight= {1-2,5} + const greeting = "Hello, World!"; + function sayHello() { + console.log(greeting); + } + sayHello(); + ``` + + ````mdx Format + ```javascript highlight={1-2,5} + const greeting = "Hello, World!"; + function sayHello() { + console.log(greeting); + } + sayHello(); + ``` + ```` +
- ### Mise au point sur des lignes + ### Mise en évidence de lignes
-Concentrez-vous sur des lignes spécifiques dans vos code block en utilisant `focus` avec des numéros de ligne ou des intervalles. - -```javascript Line Focus Example focus= {2,4-5} -const greeting = "Bonjour, le monde !"; -function sayHello() { - console.log(greeting); -} -sayHello(); -``` - -````mdx -```javascript Exemple de mise en évidence de ligne focus={2,4-5} -const greeting = "Hello, World!"; -function sayHello() { - console.log(greeting); -} -sayHello(); -``` -```` +Mettez en évidence des lignes spécifiques dans vos code blocks à l’aide de `focus` avec des numéros de ligne ou des plages. + + + ```javascript Exemple de mise en évidence de lignes focus={2,4-5} + const greeting = "Hello, World!"; + function sayHello() { + console.log(greeting); + } + sayHello(); + ``` + + ````mdx Format + ```javascript focus={2,4-5} + const greeting = "Hello, World!"; + function sayHello() { + console.log(greeting); + } + sayHello(); + ``` + ```` +
### Afficher les numéros de ligne
-Affichez les numéros de ligne à gauche de votre code block avec `lines`. - -```javascript Show Line Numbers Example lines -const greeting = "Bonjour, le monde !"; -function sayHello() { - console.log(greeting); -} -sayHello(); -``` - -````mdx -```javascript Show Line Numbers Exemple lines -const greeting = "Hello, World!"; -function sayHello() { - console.log(greeting); -} -sayHello(); -``` -```` +Affichez les numéros de ligne à gauche de votre code block à l’aide de `lines`. + + + ```javascript Exemple d’affichage des numéros de ligne lines + const greeting = "Hello, World!"; + function sayHello() { + console.log(greeting); + } + sayHello(); + ``` + + ````mdx Format + ```javascript lines + const greeting = "Hello, World!"; + function sayHello() { + console.log(greeting); + } + sayHello(); + ``` + ```` +
### Dépliable
-Permettez aux utilisateurs d’ouvrir et de replier de longs code block à l’aide de `expandable`. - -```python Expandable Example expandable -from datetime import datetime, timedelta -from typing import Dict, List, Optional -from dataclasses import dataclass - -@dataclass -class Book: - title: str - author: str - isbn: str - checked_out: bool = False - due_date: Optional[datetime] = None - -class Library: - def __init__(self): - self.books: Dict[str, Book] = {} - self.checkouts: Dict[str, List[str]] = {} # usager -> liste des ISBN - - def add_book(self, book: Book) -> None: - if book.isbn in self.books: - raise ValueError(f"Livre avec l'ISBN {book.isbn} existe déjà") - self.books[book.isbn] = book - - def checkout_book(self, isbn: str, patron: str, days: int = 14) -> None: - if patron not in self.checkouts: - self.checkouts[patron] = [] - - book = self.books.get(isbn) - if not book: - raise ValueError("Livre introuvable") - - if book.checked_out: - raise ValueError("Le livre est déjà emprunté") - - if len(self.checkouts[patron]) >= 3: - raise ValueError("L'usager a atteint la limite d'emprunt") - - book.checked_out = True - book.due_date = datetime.now() + timedelta(days=days) - self.checkouts[patron].append(isbn) - - def return_book(self, isbn: str) -> float: - book = self.books.get(isbn) - if not book or not book.checked_out: - raise ValueError("Livre introuvable ou non emprunté") - - late_fee = 0.0 - if datetime.now() > book.due_date: - days_late = (datetime.now() - book.due_date).days - late_fee = days_late * 0.50 - - book.checked_out = False - book.due_date = None - - # Retirer des emprunts de l'usager - for patron, books in self.checkouts.items(): - if isbn in books: - books.remove(isbn) - break - - return late_fee - - def search(self, query: str) -> List[Book]: - query = query.lower() - return [ - book for book in self.books.values() - if query in book.title.lower() or query in book.author.lower() - ] - -def main(): - library = Library() - - # Ajouter quelques livres - books = [ - Book("The Hobbit", "J.R.R. Tolkien", "978-0-261-10295-4"), - Book("1984", "George Orwell", "978-0-452-28423-4"), - ] - - for book in books: - library.add_book(book) - - # Exemple d'emprunt et de retour - library.checkout_book("978-0-261-10295-4", "patron123") - late_fee = library.return_book("978-0-261-10295-4") - print(f"Frais de retard : {late_fee:.2f} $") - -if __name__ == "__main__": - main() -``` - -````mdx -```python Exemple extensible expandable -from datetime import datetime, timedelta -from typing import Dict, List, Optional -from dataclasses import dataclass - -# ... - -if __name__ == "__main__": - main() -``` -```` +Permettez aux utilisateurs d’ouvrir et de replier de longs code blocks à l’aide de `expandable`. + + + ```python Expandable example expandable + from datetime import datetime, timedelta + from typing import Dict, List, Optional + from dataclasses import dataclass + + @dataclass + class Book: + title: str + author: str + isbn: str + checked_out: bool = False + due_date: Optional[datetime] = None + + class Library: + def __init__(self): + self.books: Dict[str, Book] = {} + self.checkouts: Dict[str, List[str]] = {} # patron -> list of ISBNs + + def add_book(self, book: Book) -> None: + if book.isbn in self.books: + raise ValueError(f"Book with ISBN {book.isbn} already exists") + self.books[book.isbn] = book + + def checkout_book(self, isbn: str, patron: str, days: int = 14) -> None: + if patron not in self.checkouts: + self.checkouts[patron] = [] + + book = self.books.get(isbn) + if not book: + raise ValueError("Book not found") + + if book.checked_out: + raise ValueError("Book is already checked out") + + if len(self.checkouts[patron]) >= 3: + raise ValueError("Patron has reached checkout limit") + + book.checked_out = True + book.due_date = datetime.now() + timedelta(days=days) + self.checkouts[patron].append(isbn) + + def return_book(self, isbn: str) -> float: + book = self.books.get(isbn) + if not book or not book.checked_out: + raise ValueError("Book not found or not checked out") + + late_fee = 0.0 + if datetime.now() > book.due_date: + days_late = (datetime.now() - book.due_date).days + late_fee = days_late * 0.50 + + book.checked_out = False + book.due_date = None + + # Remove from patron's checkouts + for patron, books in self.checkouts.items(): + if isbn in books: + books.remove(isbn) + break + + return late_fee + + def search(self, query: str) -> List[Book]: + query = query.lower() + return [ + book for book in self.books.values() + if query in book.title.lower() or query in book.author.lower() + ] + + def main(): + library = Library() + + # Add some books + books = [ + Book("The Hobbit", "J.R.R. Tolkien", "978-0-261-10295-4"), + Book("1984", "George Orwell", "978-0-452-28423-4"), + ] + + for book in books: + library.add_book(book) + + # Checkout and return example + library.checkout_book("978-0-261-10295-4", "patron123") + late_fee = library.return_book("978-0-261-10295-4") + print(f"Late fee: ${late_fee:.2f}") + + if __name__ == "__main__": + main() + ``` + + ````text Format + ```python expandable + from datetime import datetime, timedelta + from typing import Dict, List, Optional + from dataclasses import dataclass + + # ... + + if __name__ == "__main__": + main() + ``` + ```` +
### Retour à la ligne
-Activez l’habillage du texte pour les lignes longues avec `wrap`. Cela évite le défilement horizontal et facilite la lecture des lignes longues. - -```javascript Wrap Example wrap -const greeting = "Bonjour, le monde ! Je suis une longue ligne de texte qui va passer à la ligne suivante."; -function sayHello() { - console.log(greeting); -} -sayHello(); -``` - -````mdx -```javascript Exemple de retour à la ligne -const greeting = "Bonjour, le monde ! Je suis une longue ligne de texte qui va se retourner à la ligne suivante."; -function sayHello() { - console.log(greeting); -} -sayHello(); -``` -```` +Activez l’habillage du texte pour les lignes longues avec `wrap`. Cela évite le défilement horizontal et rend les longues lignes plus faciles à lire. + + + ```javascript Wrap example wrap + const greeting = "Hello, World! I am a long line of text that will wrap to the next line."; + function sayHello() { + console.log(greeting); + } + sayHello(); + ``` + + ````mdx Format + ```javascript wrap + const greeting = "Hello, World! I am a long line of text that will wrap to the next line."; + function sayHello() { + console.log(greeting); + } + sayHello(); + ``` + ```` +
### Diff
-Affichez un diff visuel des lignes ajoutées ou supprimées dans vos code blocks. Les lignes ajoutées sont mises en évidence en vert et les lignes supprimées en rouge. +Affichez un diff visuel des lignes ajoutées ou supprimées dans vos code blocks. Les lignes ajoutées sont surlignées en vert et les lignes supprimées en rouge. Pour créer des diffs, ajoutez ces commentaires spéciaux à la fin des lignes dans votre code block : -* `// [!code ++]` : Marquez une ligne comme ajoutée (mise en évidence en vert). -* `// [!code --]` : Marquez une ligne comme supprimée (mise en évidence en rouge). +* `// [!code ++]` : Marque une ligne comme ajoutée (surlignage vert). +* `// [!code --]` : Marque une ligne comme supprimée (surlignage rouge). Pour plusieurs lignes consécutives, indiquez le nombre de lignes après un deux-points : -* `// [!code ++:3]` : Marquez la ligne actuelle plus les deux suivantes comme ajoutées. -* `// [!code --:5]` : Marquez la ligne actuelle plus les quatre suivantes comme supprimées. +* `// [!code ++:3]` : Marque la ligne actuelle plus les deux suivantes comme ajoutées. +* `// [!code --:5]` : Marque la ligne actuelle plus les quatre suivantes comme supprimées. La syntaxe des commentaires doit correspondre à votre langage de programmation (par exemple, `//` pour JavaScript ou `#` pour Python). -```js Diff Example icon="code" lines -const greeting = "Bonjour, le monde !"; // [!code ++] -function sayHello() { - console.log("Bonjour, le monde !"); // [!code --] - console.log(greeting); // [!code ++] -} -sayHello(); -``` - -````text -```js Exemple Diff icon="code" lines -const greeting = "Hello, World!"; // [!code ++] -function sayHello() { - console.log("Hello, World!"); // [!code --] - console.log(greeting); // [!code ++] -} -sayHello(); -``` -```` + + ```js Diff example lines + const greeting = "Hello, World!"; // [!code ++] + function sayHello() { + console.log("Hello, World!"); // [!code --] + console.log(greeting); // [!code ++] + } + sayHello(); + ``` + + ````text Format + ```js lines + const greeting = "Hello, World!"; // [!code ++] + function sayHello() { + console.log("Hello, World!"); // [!code --] + console.log(greeting); // [!code ++] + } + sayHello(); + ``` + ```` + \ No newline at end of file diff --git a/zh/code.mdx b/zh/code.mdx index 6b1f9d620..48ddcbe30 100644 --- a/zh/code.mdx +++ b/zh/code.mdx @@ -24,27 +24,29 @@ icon: "code" ### 代码块
-使用[围栏代码块](https://www.markdownguide.org/extended-syntax/#fenced-code-blocks),即用三个反引号将代码包裹起来。代码块支持复制;如果启用了 AI 助手,用户还可以让 AI 解释代码。 - -为实现语法高亮并启用元选项,请指定编程语言。在语言标识后添加任意元选项,例如 title 或 icon。 - -```java HelloWorld.java lines icon="java" -class HelloWorld { - public static void main(String[] args) { - System.out.println("你好,世界!"); - } -} -``` - -````mdx -```java HelloWorld.java lines icon="java" -class HelloWorld { - public static void main(String[] args) { - System.out.println("你好,世界!"); - } -} -``` -```` +使用[围栏代码块](https://www.markdownguide.org/extended-syntax/#fenced-code-blocks),用三个反引号包裹代码。代码块可复制;如果启用了 AI 助手,用户还可以让 AI 解释代码。 + +为实现语法高亮并启用元选项,请指定编程语言。在语言标识之后添加任意元选项,例如标题或 icon。 + + + ```java HelloWorld.java example lines icon="java" + class HelloWorld { + public static void main(String[] args) { + System.out.println("Hello, World!"); + } + } + ``` + + ````mdx Format + ```java HelloWorld.java lines icon="java" + class HelloWorld { + public static void main(String[] args) { + System.out.println("Hello, World!"); + } + } + ``` + ```` +
## 代码块选项 @@ -67,89 +69,97 @@ class HelloWorld { ### 语法高亮
-在代码块的起始三个反引号后紧跟编程语言名称即可启用语法高亮。 - -我们使用 [Shiki](https://shiki.style/) 提供语法高亮,支持其所有可用语言。完整列表请参见 Shiki 文档中的 [languages](https://shiki.style/languages)。 - -```java -class HelloWorld { - public static void main(String[] args) { - System.out.println("你好,世界!"); - } -} -``` - -````mdx -```java -class HelloWorld { - public static void main(String[] args) { - System.out.println("你好,世界!"); - } -} -``` -```` +在代码块起始的三个反引号后指定编程语言即可启用语法高亮。 + +我们使用 [Shiki](https://shiki.style/) 提供语法高亮,支持其所有可用语言。完整列表请参见 Shiki 文档中的[语言](https://shiki.style/languages)。 + + + ```java 语法高亮示例 + class HelloWorld { + public static void main(String[] args) { + System.out.println("Hello, World!"); + } + } + ``` + + ````mdx 格式 + ```java + class HelloWorld { + public static void main(String[] args) { + System.out.println("Hello, World!"); + } + } + ``` + ```` +
### Twoslash
-在 JavaScript 和 TypeScript 的代码块中,使用 `twoslash` 可启用交互式类型信息。用户将鼠标悬停在变量、函数和参数上时,可像在 IDE 中一样查看类型和错误。 +在 JavaScript 和 TypeScript 代码块中,使用 `twoslash` 可启用交互式类型信息。用户可以像在 IDE 中一样,将鼠标悬停在变量、函数和参数上,以查看类型与错误提示。 -```ts title="Twoslash Example" twoslash -type Pet = "cat" | "dog" | "hamster"; + + ```ts twoslash Twoslash example + type Pet = "cat" | "dog" | "hamster"; -function adoptPet(name: string, type: Pet) { - return `${name} 这只 ${type} 现在被领养了!`; -} + function adoptPet(name: string, type: Pet) { + return `${name} the ${type} is now adopted!`; + } -// 悬停查看推断类型 -const message = adoptPet("Mintie", "cat"); -``` + // 悬停以查看推断的类型 + const message = adoptPet("Mintie", "cat"); + ``` -````mdx -```ts title="Twoslash 示例" twoslash -type Pet = "cat" | "dog" | "hamster"; + ````mdx Format + ```ts twoslash + type Pet = "cat" | "dog" | "hamster"; -function adoptPet(name: string, type: Pet) { - return `${name} the ${type} is now adopted! 🎉`; -} + function adoptPet(name: string, type: Pet) { + return `${name} the ${type} is now adopted!`; + } -// 悬停查看推断的类型 -const message = adoptPet("Mintie", "cat"); -``` -```` + // 悬停以查看推断的类型 + const message = adoptPet("Mintie", "cat"); + ``` + ```` +
### 标题
-为代码示例添加标题。使用 `title="Your title"`,或在单独一行提供一个字符串。 +为代码示例添加一个标题。使用 `title="Your title"`,或在单行中添加字符串。 -```javascript Code Block Example -const hello = "world"; -``` + + ```javascript 标题示例 + const hello = "world"; + ``` -````mdx -```javascript 代码块示例 -const hello = "world"; -``` -```` + ````mdx 格式 + ```javascript 标题示例 + const hello = "world"; + ``` + ```` +
### 图标
-使用 `icon` 属性为代码块添加图标。参见[图标](/zh/components/icons)以查看所有可用选项。 +使用 `icon` 属性为代码块添加图标。请参阅 [图标](/zh/components/icons) 了解所有可用选项。 -```javascript icon="square-js" -const hello = "world"; -``` + + ```javascript 图标 示例 icon="square-js" + const hello = "world"; + ``` -````mdx -```javascript icon="square-js" -const hello = "world"; -``` -```` + ````mdx 格式 + ```javascript icon="square-js" + const hello = "world"; + ``` + ```` +
### 行高亮 @@ -157,47 +167,51 @@ const hello = "world"; 在代码块中使用 `highlight` 并指定要高亮的行号或范围,以突出显示特定行。 -```javascript Line Highlighting Example highlight= {1-2,5} -const greeting = "你好,世界!"; -function sayHello() { - console.log(greeting); -} -sayHello(); -``` - -````mdx -```javascript 行高亮示例 highlight={1-2,5} -const greeting = "Hello, World!"; -function sayHello() { - console.log(greeting); -} -sayHello(); -``` -```` - -
- ### 行高亮 + + ```javascript Line highlighting example highlight= {1-2,5} + const greeting = "Hello, World!"; + function sayHello() { + console.log(greeting); + } + sayHello(); + ``` + + ````mdx Format + ```javascript highlight={1-2,5} + const greeting = "Hello, World!"; + function sayHello() { + console.log(greeting); + } + sayHello(); + ``` + ```` + + +
+ ### 行聚焦
-在代码块中可使用带有行号或范围的 `focus` 来高亮指定行。 - -```javascript Line Focus Example focus= {2,4-5} -const greeting = "你好,世界!"; -function sayHello() { - console.log(greeting); -} -sayHello(); -``` - -````mdx -```javascript 行聚焦示例 focus={2,4-5} -const greeting = "Hello, World!"; -function sayHello() { - console.log(greeting); -} -sayHello(); -``` -```` +在代码块中使用带有行号或范围的 `focus` 来突出显示特定行。 + + + ```javascript Line focus example focus= {2,4-5} + const greeting = "Hello, World!"; + function sayHello() { + console.log(greeting); + } + sayHello(); + ``` + + ````mdx Format + ```javascript focus={2,4-5} + const greeting = "Hello, World!"; + function sayHello() { + console.log(greeting); + } + sayHello(); + ``` + ```` +
### 显示行号 @@ -205,23 +219,25 @@ sayHello(); 使用 `lines` 在代码块左侧显示行号。 -```javascript Show Line Numbers Example lines -const greeting = "你好,世界!"; -function sayHello() { - console.log(greeting); -} -sayHello(); -``` - -````mdx -```javascript 显示行号 示例行 -const greeting = "Hello, World!"; -function sayHello() { - console.log(greeting); -} -sayHello(); -``` -```` + + ```javascript 显示行号示例 lines + const greeting = "Hello, World!"; + function sayHello() { + console.log(greeting); + } + sayHello(); + ``` + + ````mdx 格式 + ```javascript lines + const greeting = "Hello, World!"; + function sayHello() { + console.log(greeting); + } + sayHello(); + ``` + ```` +
### 可展开 @@ -229,167 +245,173 @@ sayHello(); 使用 `expandable` 让用户展开或折叠较长的代码块。 -```python Expandable Example expandable -from datetime import datetime, timedelta -from typing import Dict, List, Optional -from dataclasses import dataclass - -@dataclass -class Book: - title: str - author: str - isbn: str - checked_out: bool = False - due_date: Optional[datetime] = None - -class Library: - def __init__(self): - self.books: Dict[str, Book] = {} - self.checkouts: Dict[str, List[str]] = {} # 借阅者 -> ISBN列表 - - def add_book(self, book: Book) -> None: - if book.isbn in self.books: - raise ValueError(f"ISBN为 {book.isbn} 的图书已存在") - self.books[book.isbn] = book - - def checkout_book(self, isbn: str, patron: str, days: int = 14) -> None: - if patron not in self.checkouts: - self.checkouts[patron] = [] - - book = self.books.get(isbn) - if not book: - raise ValueError("未找到图书") - - if book.checked_out: - raise ValueError("图书已被借出") - - if len(self.checkouts[patron]) >= 3: - raise ValueError("借阅者已达到借阅限制") - - book.checked_out = True - book.due_date = datetime.now() + timedelta(days=days) - self.checkouts[patron].append(isbn) - - def return_book(self, isbn: str) -> float: - book = self.books.get(isbn) - if not book or not book.checked_out: - raise ValueError("未找到图书或图书未被借出") - - late_fee = 0.0 - if datetime.now() > book.due_date: - days_late = (datetime.now() - book.due_date).days - late_fee = days_late * 0.50 - - book.checked_out = False - book.due_date = None - - # 从借阅者的借阅记录中移除 - for patron, books in self.checkouts.items(): - if isbn in books: - books.remove(isbn) - break - - return late_fee - - def search(self, query: str) -> List[Book]: - query = query.lower() - return [ - book for book in self.books.values() - if query in book.title.lower() or query in book.author.lower() - ] - -def main(): - library = Library() - - # 添加一些图书 - books = [ - Book("The Hobbit", "J.R.R. Tolkien", "978-0-261-10295-4"), - Book("1984", "George Orwell", "978-0-452-28423-4"), - ] - - for book in books: - library.add_book(book) - - # 借阅和归还示例 - library.checkout_book("978-0-261-10295-4", "patron123") - late_fee = library.return_book("978-0-261-10295-4") - print(f"滞纳金: ${late_fee:.2f}") - -if __name__ == "__main__": - main() -``` - -````mdx -```python 可展开示例 expandable -from datetime import datetime, timedelta -from typing import Dict, List, Optional -from dataclasses import dataclass - -# ... - -if __name__ == "__main__": - main() -``` -```` + + ```python Expandable example expandable + from datetime import datetime, timedelta + from typing import Dict, List, Optional + from dataclasses import dataclass + + @dataclass + class Book: + title: str + author: str + isbn: str + checked_out: bool = False + due_date: Optional[datetime] = None + + class Library: + def __init__(self): + self.books: Dict[str, Book] = {} + self.checkouts: Dict[str, List[str]] = {} # patron -> list of ISBNs + + def add_book(self, book: Book) -> None: + if book.isbn in self.books: + raise ValueError(f"Book with ISBN {book.isbn} already exists") + self.books[book.isbn] = book + + def checkout_book(self, isbn: str, patron: str, days: int = 14) -> None: + if patron not in self.checkouts: + self.checkouts[patron] = [] + + book = self.books.get(isbn) + if not book: + raise ValueError("Book not found") + + if book.checked_out: + raise ValueError("Book is already checked out") + + if len(self.checkouts[patron]) >= 3: + raise ValueError("Patron has reached checkout limit") + + book.checked_out = True + book.due_date = datetime.now() + timedelta(days=days) + self.checkouts[patron].append(isbn) + + def return_book(self, isbn: str) -> float: + book = self.books.get(isbn) + if not book or not book.checked_out: + raise ValueError("Book not found or not checked out") + + late_fee = 0.0 + if datetime.now() > book.due_date: + days_late = (datetime.now() - book.due_date).days + late_fee = days_late * 0.50 + + book.checked_out = False + book.due_date = None + + # Remove from patron's checkouts + for patron, books in self.checkouts.items(): + if isbn in books: + books.remove(isbn) + break + + return late_fee + + def search(self, query: str) -> List[Book]: + query = query.lower() + return [ + book for book in self.books.values() + if query in book.title.lower() or query in book.author.lower() + ] + + def main(): + library = Library() + + # Add some books + books = [ + Book("The Hobbit", "J.R.R. Tolkien", "978-0-261-10295-4"), + Book("1984", "George Orwell", "978-0-452-28423-4"), + ] + + for book in books: + library.add_book(book) + + # Checkout and return example + library.checkout_book("978-0-261-10295-4", "patron123") + late_fee = library.return_book("978-0-261-10295-4") + print(f"Late fee: ${late_fee:.2f}") + + if __name__ == "__main__": + main() + ``` + + ````text 格式 + ```python expandable + from datetime import datetime, timedelta + from typing import Dict, List, Optional + from dataclasses import dataclass + + # ... + + if __name__ == "__main__": + main() + ``` + ```` +
### 自动换行
-使用 `wrap` 为长行启用自动换行。这样可以防止横向滚动,并使长行更易读。 - -```javascript Wrap Example wrap -const greeting = "你好,世界!我是一行很长的文本,会换行到下一行。"; -function sayHello() { - console.log(greeting); -} -sayHello(); -``` - -````mdx -```javascript 换行示例 wrap -const greeting = "Hello, World! I am a long line of text that will wrap to the next line."; -function sayHello() { - console.log(greeting); -} -sayHello(); -``` -```` +使用 `wrap` 为长行启用自动换行。这样可以避免水平滚动,并使长行更易阅读。 + + + ```javascript Wrap example wrap + const greeting = "Hello, World! I am a long line of text that will wrap to the next line."; + function sayHello() { + console.log(greeting); + } + sayHello(); + ``` + + ````mdx Format + ```javascript wrap + const greeting = "Hello, World! I am a long line of text that will wrap to the next line."; + function sayHello() { + console.log(greeting); + } + sayHello(); + ``` + ```` +
### Diff
-在代码块中可视化展示新增或删除的行。新增行以绿色高亮,删除行以红色高亮。 +在代码块中以可视化方式展示新增或删除的行。新增行将以绿色高亮,删除行将以红色高亮。 -要创建差异视图,请在代码块的行尾添加以下特殊注释: +要创建差异,请在代码块中目标行的末尾添加以下特殊注释: * `// [!code ++]`:将该行标记为新增(绿色高亮)。 * `// [!code --]`:将该行标记为删除(红色高亮)。 -对多行连续内容,可在冒号后指定行数: +对于多行连续的更改,可在冒号后指定行数: * `// [!code ++:3]`:将当前行及其后两行标记为新增。 * `// [!code --:5]`:将当前行及其后四行标记为删除。 -注释语法必须与所使用的编程语言一致(例如,JavaScript 使用 `//`,Python 使用 `#`)。 - -```js Diff Example icon="code" lines -const greeting = "你好,世界!"; // [!code ++] -function sayHello() { - console.log("你好,世界!"); // [!code --] - console.log(greeting); // [!code ++] -} -sayHello(); -``` - -````text -```js Diff 示例 icon="code" lines -const greeting = "Hello, World!"; // [!code ++] -function sayHello() { - console.log("Hello, World!"); // [!code --] - console.log(greeting); // [!code ++] -} -sayHello(); -``` -```` +注释语法须与所用编程语言一致(例如,JavaScript 使用 `//`,Python 使用 `#`)。 + + + ```js Diff example lines + const greeting = "Hello, World!"; // [!code ++] + function sayHello() { + console.log("Hello, World!"); // [!code --] + console.log(greeting); // [!code ++] + } + sayHello(); + ``` + + ````text Format + ```js lines + const greeting = "Hello, World!"; // [!code ++] + function sayHello() { + console.log("Hello, World!"); // [!code --] + console.log(greeting); // [!code ++] + } + sayHello(); + ``` + ```` + \ No newline at end of file