Avatar ·

Quelles sont les différences entre les extensions .ts et .tsx dans TypeScript pour React ?

Bonjour à tous ! J'ai récemment commencé à apprendre TypeScript avec React et j'ai rencontré une situation que je ne comprends pas. Lorsque je crée des composants, je vois que deux extensions différentes sont utilisées dans les projets : `.ts` et `.tsx`. Par exemple, j'ai un fichier `Button.ts` et un fichier `App.tsx`. Les deux contiennent du code TypeScript, mais quand j'essaie d'écrire du JSX dans un fichier `.ts`, l'éditeur de code se plaint, alors qu'en le renommant en `.tsx`, tout fonctionne. Voici un exemple de mon code qui ne fonctionne pas dans `Button.ts` : ```typescript import React from 'react'; interface ButtonProps { label: string; onClick: () => void; } // Erreur : JSX n'est pas supporté dans les fichiers .ts const Button: React.FC = ({ label, onClick }) => { return ; }; ``` Et ce même code fonctionne parfaitement si on enregistre le fichier sous `Button.tsx`. J'ai aussi remarqué que certains de mes collègues utilisent `.ts` pour les utilitaires simples et les types, et `.tsx` uniquement pour les composants avec du markup. Mais y a-t-il une règle stricte ?