React 安装

提示

在官方文档 https://zh-hans.react.dev/learn/start-a-new-react-project 中并没有提到如何搭建一个小型 React 项目，基本上都是推广生产级的 React 框架，例如 Next.js、Remix、Gatsby、 Expo（原生应用）。

所以本文将会使用 Vite 来搭建一个 React + TS 项目。

搭建第一个 React 项目

兼容性注意

Vite 需要 Node.js 版本 18+ 或 20+。然而，有些模板需要依赖更高的 Node 版本才能正常运行，当你的包管理器发出警告时，请注意升级你的 Node 版本。

NPM

$ npm create vite@latest

Yarn

$ yarn create vite

根据界面提示选择模板，可参考以下方式。

? Project name: › vite-project
? Select a framework: › - Use arrow-keys. Return to submit.
    Vanilla
    Vue
❯   React
    Preact
    Lit
    Svelte
    Solid
    Qwik
    Others
? Select a variant: › - Use arrow-keys. Return to submit.
    TypeScript
❯   TypeScript + SWC
    JavaScript
    JavaScript + SWC
    Remix ↗

搭建项目后使用命令 cd vite-project 进入目录，并通过 Yarn 安装依赖。

最后通过 npm run dev 启动项目。

到此项目已经搭建完成啦！！！