一条命令创建免配置的 React + Antd + Typescript 项目

一条命令创建免配置的 React + Antd + Typescript 项目

你是 Antd 的重度用户吗?

你想在项目中尝试一下 Typescript 吗?

你还在为繁琐的项目烦恼吗?

现在只需要一行命令,就可以创建一免配置的 React + Antd + Typescript 项目。再也不用把精力消耗在各种工具繁琐的配置上,只需专注于功能的实现。早日将产品上线、升职、加薪、迎娶白富美。

因为经常使用在工作上用到 Antd 组件库,并且已经切换到 Typescript。按照 Antd 官方教程,还需要额外的配置 ts-import-plugin 和 react-app-rewired 等功能,想当浪费时间。因此,基于 react-scripts-ts,我将 Antd 需要的基本功能整合在一次,创建了 react-scirpts-ts-antd 这个项目。搭配 create-react-app 使用,实现了一键创建免配置项目。


用法

首先先确保已经安装了 create-react-app,如果还没有安装,先运行命令

npm install -g create-react-app

接着就可以创建自己的项目

create-react-app my-project --scripts-version=react-scripts-ts-antd

等待命令执行完毕,一个属于你的免配置项目就创建好了,可以专心去实现功能了。


特性

  • 自动安装 antd 包,antd-mobile 需要自行安装。
  • 集成了 ts-import-plugin,实现组件的按需加载。
  • 集成了 react-app-rewired,无需 eject 弹出配置,即可修改 Webpack 配置。
  • 配置好了 scss-loader 和 less-loader,可以直接在项目中使用 less 和 scss。
  • 配置好了 tsconfig.json,可以直接在项目中写 Typescript。
  • 包含所有 react-scripts-ts 提供的基本功能,原汁原味。

项目地址

SZzzzz/react-scripts-ts-antdgithub.com图标

欢迎使用、star、issue、PR。

编辑于 2018-02-02

文章被以下专栏收录