TypeScript में React के लिए .ts और .tsx एक्सटेंशन में क्या अंतर है?
सभी को नमस्ते! मैंने हाल ही में React के साथ TypeScript सीखना शुरू किया है और मुझे एक समझ से परे स्थिति का सामना करना पड़ा। जब मैं कम्पोनेंट बनाता हूँ, तो मैं देखता हूँ कि प्रोजेक्ट्स में दो अलग-अलग एक्सटेंशन का उपयोग किया जाता है: `.ts` और `.tsx`। उदाहरण के लिए, मेरे पास `Button.ts` फ़ाइल और `App.tsx` फ़ाइल है। दोनों में TypeScript कोड है, लेकिन जब मैं `.ts` फ़ाइल के अंदर JSX लिखने की कोशिश करता हूँ, तो कोड एडिटर त्रुटि दिखाता है, और जब मैं इसका नाम बदलकर `.tsx` कर देता हूँ, तो सब कुछ ठीक काम करता है।
यहाँ मेरे कोड का उदाहरण है जो `Button.ts` में काम नहीं करता:
```typescript
import React from 'react';
interface ButtonProps {
label: string;
onClick: () => void;
}
// त्रुटि: .ts फ़ाइलों में JSX समर्थित नहीं है
const Button: React.FC = ({ label, onClick }) => {
return ;
};
```
जबकि यही कोड `.tsx` में बिल्कुल सही काम करता है।