{"id":17207000,"url":"https://github.com/dangosky/react-scaffold-tool","last_synced_at":"2026-05-08T00:37:16.768Z","repository":{"id":97705413,"uuid":"294591263","full_name":"DangoSky/react-scaffold-tool","owner":"DangoSky","description":"build my own react scaffold","archived":false,"fork":false,"pushed_at":"2023-05-30T16:28:24.000Z","size":33,"stargazers_count":3,"open_issues_count":0,"forks_count":0,"subscribers_count":3,"default_branch":"master","last_synced_at":"2025-01-30T10:14:46.228Z","etag":null,"topics":["react","webpack"],"latest_commit_sha":null,"homepage":"","language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/DangoSky.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null}},"created_at":"2020-09-11T04:10:22.000Z","updated_at":"2023-05-30T16:28:29.000Z","dependencies_parsed_at":"2024-12-03T04:40:21.202Z","dependency_job_id":null,"html_url":"https://github.com/DangoSky/react-scaffold-tool","commit_stats":null,"previous_names":[],"tags_count":0,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/DangoSky%2Freact-scaffold-tool","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/DangoSky%2Freact-scaffold-tool/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/DangoSky%2Freact-scaffold-tool/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/DangoSky%2Freact-scaffold-tool/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/DangoSky","download_url":"https://codeload.github.com/DangoSky/react-scaffold-tool/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":245449681,"owners_count":20617190,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["react","webpack"],"created_at":"2024-10-15T02:44:27.466Z","updated_at":"2026-05-08T00:37:11.747Z","avatar_url":"https://github.com/DangoSky.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# React-scaffold-tool\n\n[English](https://github.com/DangoSky/react-scaffold-tool/blob/master/README_en.md) | 简体中文\n\n## 描述\n\n一款用于 React 前端项目开发的脚手架，可以快速搭建起一个 React 项目架子。\n\n## 使用\n\n在计算机上已经装好 Node 开发环境后，全局安装 react-scaffold-tool：\n\n```js\nnpm install -g react-scaffold-tool\n```\n\n使用 react-scaffold-tool 创建一个新项目：\n\n```js\ncli init \u003c项目名称\u003e\ncd \u003c项目名称\u003e\nnpm install\n```\n\n项目模板的目录结构：\n\n```js\n├── README.md\n├── package.json\n├── tsconfig.json\n├── images.d.ts // 声明各类图片文件\n├── img // 存放图片资源\n├── .gitignore\n├── .npmrc // 默认指定使用官方的 npm 源\n├── .babelrc\n├── webpack\n│   ├── webpack.common.js // dev 和 prod 的公共 webpack 配置\n│   ├── webpack.dev.js // dev 的 webpack 配置\n└── src\n    ├── App.tsx // 根组件\n    ├── index.tsx // 项目入口文件\n    ├── style.less // 根组件样式\n    ├── index.html // 打包时的 HTML 模板\n    ├── api \n    │   ├── index.ts  // 封装了 get 和 post 方法\n    │   ├── modules // 后续根据项目模块的划分，在这里添加接口\n    ├── pages // 项目业务组件\n```\n\n## 配置的功能\n\n- [x] React 相关依赖，包括 React-Router\n- [x] TypeScript 编译\n- [x] Less 编译\n- [x] Babel 编译\n- [x] Antd UI 库\n- [x] 网络模板封装\n- [x] 热重载\n- [ ] Eslint\n- [ ] 打包优化\n- [ ] 构建优化\n- [ ] 动态更新模板。（如果后续模板变化了，如何在已有项目里更新模板。考虑到用户可能已经进行了二次修改，所以新旧模板可能有冲突）\n\n\n## 更新日志\n\n- 2020/10/16：增加 Webpack 生产环境配置，取消 SourceMap 以减小打出来的包体积；使用 vender 分离出 React 等不变化的模块。\n- 2020/09/17：增加网络请求模板，并且分离出项目模板的开发分支和线上分支。\n- 2020/09/14：初步完成 react-scaffold-tool 并发布 npm 包。\n- 2020/09/11：开始搭建 react-scaffold-tool 脚手架。\n- 2020/09/08：完成项目模板的基本配置，包括 react、ts、less、babel、antd 和热重载等各项配置。\n- 2020/08/29：开始使用 webpack 从零配置一个新项目。\n\n\n## FAQ\n\n1. Q：为什么不直接使用 create-react-app 等官方脚手架？\n\nA：三点原因，一是 create-react-app 存在诸多限制，它创建出来的新项目模板没有开放 `webpack.config.js` 等配置文件，需要 `npm run eject` 去获取，而且该操作不可逆。二是 create-react-app 没有默认配置好 less 和 ts 等 loader，现在的前端项目几乎都采用了 ts 和 less/sass，每次新建项目后都得再手动配置 ts-loader 和 less-loader 很麻烦。三是工具虽好，但不能仅仅停留在会用的程度，需要自己弄清楚工具内部做了什么、是怎么做的，于是乎就有了这么一个契机去自己配置一个脚手架出来了。\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdangosky%2Freact-scaffold-tool","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fdangosky%2Freact-scaffold-tool","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fdangosky%2Freact-scaffold-tool/lists"}