React基础教程:react脚手架

打印 上一主题 下一主题

主题 708|帖子 708|积分 2124

1、create-react-app

全局安装create-react-app
  1. npm install -g create-react-app
复制代码

安装成功之后,通过命令create-react-app -V查抄是否安装成功

创建一个项目
  1. create-react-app my-app
复制代码

假如不想全局安装,可以直接利用npx,也可以实现类似的效果
  1. npx create-react-app my-app
复制代码
  这必要等待一段时间,这个过程现实上会安装三个东西:
  

   

  • 【react】:react的顶级库。
  • 【react-dom】:因为react有许多的运行情况,比如app端的react-native,我们要在web上运行就利用react-dom。
  • 【react-scripts】:包含运行和打包react应用程序的全部脚本及设置。
  假如看到以下内容,就说明安装成功了

   常见题目:npm安装失败
  

  • 切换为npm镜像为淘宝镜像

      1. npm i -g nrm
      复制代码
      1. nrm ls
      复制代码


   

    1. nrm use taobao
    2. nrm ls
    复制代码

  2、编写第一个react应用程序

react开发必要引入多个依赖文件:react.js、react-dom.js,分别又有开发版本和生产版本,create-react-app已经帮我们把这些东西安装好了。把通过CRA创建的额工程目录下的【src】目录清空,然后在里面重新创建一个index.js写入以下代码:
  1. import React from "react";
  2. import ReactDOM from 'react-dom';
  3. ReactDOM.render(<div>
  4.     <p>Team Suns</p>
  5.     <ul>
  6.         <li>杜兰特</li>
  7.         <li>布克</li>
  8.         <li>比尔</li>
  9.     </ul>
  10. </div>, document.getElementById('root'))
复制代码
免责声明:如果侵犯了您的权益,请联系站长,我们会及时删除侵权内容,谢谢合作!更多信息从访问主页:qidao123.com:ToB企服之家,中国第一个企服评测及商务社交产业平台。

本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有账号?立即注册

x
回复

使用道具 举报

0 个回复

倒序浏览

快速回复

您需要登录后才可以回帖 登录 or 立即注册

本版积分规则

道家人

金牌会员
这个人很懒什么都没写!

标签云

快速回复 返回顶部 返回列表