前言
随着 React 和 TypeScript 的普及，用 TypeScript 写 React 的项目越来越成为了一种趋势。但是在创建一个新的 React TypeScript 项目的时候，每次都需要手动配置 tsconfig.json、webpack.config.js、eslint 等文件，非常麻烦。为了解决这个问题，我们可以使用一个名为 @yajamon/generator-react-typescript 的 npm 包，来帮助我们自动生成一个符合开发规范的 React TypeScript 项目模板。
安装
首先，我们需要全局安装 yo 和 generator-react-typescript，可以使用以下命令：
npm install -g yo @yajamon/generator-react-typescript
使用
安装完成后，我们就可以使用 yo 来创建一个新的 React TypeScript 项目了。在终端中进入要创建项目的目录，运行以下命令：
yo @yajamon/react-typescript
然后，按照命令行提示进行选择，例如项目名称、作者名、是否使用 scss 等等。等待项目模板生成完毕后，我们就可以使用以下命令来启动项目：
npm start
这样，我们就可以在浏览器中查看到一个基于 React 和 TypeScript 的项目了。
项目结构
使用 @yajamon/generator-react-typescript 生成的项目结构如下所示：
-- -------------------- ---- ------- - --- ------ - --- ---- - - --- -------------- - - --- --------------- - --- ------- - - --- --------------------- - - --- ---------------------- - - --- -------------------------- - --- -------- - --- ------------ --- ------ - --- ----------- - --- ---------- - --- ------------- --- ------- - --- -------- - --- -------- - --- ------- --- --- - --- ---------- - - --- ------- - --- ------ - - --- -------- - - --- --------------- - --- --------- - --- ---------------- --- ------------- --- ------------- --- -------------- --- ---------- --- ----------------- --- ------------ --- -------------
总结
通过使用 @yajamon/generator-react-typescript，我们可以节约很多时间和精力，快速创建一个符合开发规范的 React TypeScript 项目模板。在实际开发中，我们也可以参考这个模板来编写自己的项目，并根据实际需要进行修改和调整。希望本篇文章能够对大家学习和使用 React TypeScript 有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005516281e8991b448ce8b0