(二)如何用react脚手架构建项目以及文件目录的基本介绍

1、创建项目:

打开命令窗口,切换到要创建项目的地址

执行命令:
    create-react-app  项目名称   (js版本)
    create-react-app  项目名称  --template typescript  (ts版本)

2、创建成功即可看到以下内容;若创建失败,报错信息包含:rename、 please try running this.command again as root/Administrator等类似信息, 则需要用管理者身份来打开cmd窗口或者powershell窗口来创建即可

3、启动项目

可以在目录的README.md文件中看到包含启动项目的相关项目指令!

npm  start

4、项目目录

(1)node_modules 这里面包含了react项目中会用到的一些依赖或者一些第三方库;

(2)public:里面包含了我们项目中的启动页面,react比较适合单页面项目应用开发,所以暂时只包含一个index.html,并且这也是react工程的入口页面,即启动项目后,打开的首页

3src:该文件包含了一些我们自己使用的jscssimg文件等,但你打开src文件夹你会发现很混乱,不要管什么app.js,你只需要关注index.js即可,系统默认将index.html对准了index.jsi即我们项目的入口js,它和index.html所对应。

5、目录简化

为了让目录结构更易懂,所以我们需要删除一些不必要的文件;src文件夹下原来的所有东西,除了index.js之外,都可以删掉;即只要保留入口文件即可。

你可能感兴趣的:(react,react.js,javascript,前端)