要在React項目中使用Typescript,需要先安裝Typescript和@types/react和@types/react-dom這兩個依賴。
首先,安裝Typescript和@types/react和@types/react-dom:
npm install typescript @types/react @types/react-dom
然后,在項目根目錄下創建一個tsconfig.json文件,配置Typescript編譯選項:
{
"compilerOptions": {
"target": "es5",
"module": "commonjs",
"jsx": "react",
"strict": true
}
}
接下來,將項目中的.js或.jsx文件改為.ts或.tsx文件,并在文件開頭添加類型聲明,例如:
import React from 'react';
interface Props {
name: string;
}
const App: React.FC<Props> = ({ name }) => {
return <h1>Hello, {name}!</h1>;
};
export default App;
最后,在項目中使用Typescript編譯工具(如webpack或Parcel)來編譯Typescript代碼,并運行項目。
這樣,就可以在React項目中使用Typescript了,享受類型檢查和更好的代碼提示。