create-react-app - 源码解析

create-react-app主要实现的功能:
1.根据传入的 创建文件夹
2.创建新项目的package.json文件
在这里插入图片描述
3.将create-react-app中的yarn.lock.cached文件添加到创建的项目中(统一了依赖项的版本)
4.下载 react, react-dom, react-scripts, cra-template 依赖项
在这里插入图片描述
5.更改了react, react-dom的版本,添加 ^
在这里插入图片描述在这里插入图片描述
4.执行 react-script依赖项的 init.js文件,并传入参数
在这里插入图片描述
在这里插入图片描述
react-scripts init.js (package.json的完善,项目文件的完善)
1.将 react-dev-utils 中 browserHelper.js 中的 defaultBrowsers 对象, cra-template 中 template.json 中 eslintConfig,将项目中的packages.json的scripts和 {
start: ‘react-scripts start’,
build: ‘react-scripts build’,
test: ‘react-scripts test’,
eject: ‘react-scripts eject’
}合并,以上添加到packages.json中
在这里插入图片描述
在这里插入图片描述
在这里插入图片描述

2.将cra-template插件中的template的目录复制到项目下,如果useYarn时,将 readme 文件中的 npm 更改为 yarn,将gitignore文件名更改为.gitignore
在这里插入图片描述
在这里插入图片描述
4.下载template.json中的dependencies依赖,如果项目package.json的dependencies中没有 react, react-dom,将这两个依赖项一起下载,并且删除cra-template依赖项
在这里插入图片描述

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值