React团队主要推荐使用create-react-app来创建React新的单页应用项目的最佳方式。

React脚手架(create-react-app)意义

  • 脚手架是官方提供,零配置,无需手动配置繁琐的工具即可使用
  • 充分利用 Webpack,Babel,ESLint等工具辅助项目开发
  • 关注业务,而不是工具配置

create-react-app会配置你的开发环境,以便使你能够使用最新的 JavaScript特性,提供良好的开发体验,并为生产环境优化你的应用程序。你需要在你的机器上安装 Node >= 8.10 和 npm >= 5.6

创建React项目

npx create-react-app my-app     // 创建项目,时间会有点的久

cd my-app   // 进入到安装项目中

npm start   // 启动项目

注: npm一定要切源,否则安装可能不会成功,当然如果你有vpn则另说

看到如下图所示信息,表示reactjs项目创建成功

React脚手架 创建React项目的更多相关文章

  1. React脚手架创建一个React应用以及项目目录结构详解

    react脚手架 用来帮助程序员快速创建一个基于xxx库的模板项目,包含了所有需要的配置,指定好了所有的依赖,可以直接安装/编译/运行一个简单效果 react提供了一个专门用于创建react项目的脚手 ...

  2. 七天接手react项目 系列 —— react 脚手架创建项目

    其他章节请看: 七天接手react项目 系列 react 脚手架创建项目 前面我们一直通过 script 的方式学习 react 基础知识,而真实项目通常是基于脚手架进行开发. 本篇首先通过 reac ...

  3. 用vue脚手架创建bootstrap-vue项目

    用vue脚手架创建bootstrap-vue项目 框架的地址:https://bootstrap-vue.js.org/docs/ 第一步 vue init webpack demo第二步 cd de ...

  4. 使用vue-cli脚手架创建vue项目

    使用vue-cli脚手架创建vue项目 首先,你已经安装了node. 使用vue-cli@2 创建项目 执行 命令: npm i -g vue-cli@2 //全局安装vue-cli@2脚手架 : v ...

  5. React(一)使用脚手架创建React项目

    1.安装脚手架 现在使用较多的就是这三种脚手架工具: react-boilerplate react-redux-starter-kit create-react-app 我使用的是第三种,faceb ...

  6. 使用creata-react-app脚手架创建react项目时非常慢的问题

    创建react项目必须要有下面两个步骤 cnpm install -g create-react-app  //创建react全局变量 create-react-app my-app //创建一个re ...

  7. react脚手架改造(react/react-router/redux/eslint/karam/immutable/es6/webpack/Redux DevTools)

    公司突然组织需要重新搭建一个基于node的论坛系统,前端采用react,上网找了一些脚手架,或多或少不能满足自己的需求,最终在基于YeoMan的react脚手架generator-react-webp ...

  8. 通过脚手架创建Vue项目

    第一步 准备工作 1.下载安装Node.js 验证是否安装的方法,在命令行输入node -v 2.安装Vue 在命令行输入npm install -g @vue/cli 查看Vue版本号 npm vu ...

  9. 基于3.X版本的脚手架创建VUE项目

    一.基于交互式命令行的方式,创建vue项目 1.命令:vue create 项目名称.项目名称必须是英文的.不要包含中文.特殊的字符和符号.在cmd中输入命令:vue create vue_proje ...

  10. vue-cli 3.0脚手架创建vue项目

    1. 卸载vue-cli 2.0 npm uninstall -g vue-cli 2. 安装vue-cli 3.0 npm install @vue/cli 3. 创建项目 npm create & ...

随机推荐

  1. b站的视频进度条悬浮预览视频画面实现方式

    1.探究 在看b站视频,滑到进度条的时候突发奇想,想知道这个预览图是怎么做到的 打开控制台,发现每次移动鼠标悬浮位置的时候都会发出一条网络请求,并且该请求的size显示来源于内存,当时以为每次加载视频 ...

  2. 力扣374(java&python)-猜数字大小(简单)

    题目: 猜数字游戏的规则如下: 每轮游戏,我都会从 1 到 n 随机选择一个数字. 请你猜选出的是哪个数字.如果你猜错了,我会告诉你,你猜测的数字比我选出的数字是大了还是小了.你可以通过调用一个预先定 ...

  3. App隐私合规“免费”自动化检测

    简介: App隐私合规检测提供了全面的隐私合规检测报告和专家建议,从确保形式合规(隐私政策文本合规性)及实质合规(代码层合规性)的一致性,从个人信息收集.权限使用场景.超范围采集.隐私政策.三方SDK ...

  4. 阿里云AHAS Chaos:应用及业务高可用提升工具平台之故障演练

    简介: 阿里云AHAS Chaos:应用及业务高可用提升工具平台之故障演练 应用高可用服务AHAS及故障演练AHAS Chaos 应用高可用服务(Application High Availabili ...

  5. 国内唯一!阿里云容器服务进入 Forrester 领导者象限

    ​简介:近日,国际权威咨询机构 Forrester 发布< The Forrester WaveTM: Public Cloud Container Platforms, Q1 2022 > ...

  6. 自己动手写符合自己业务需求的eslint规则

    ​简介:eslint是构建在AST Parser基础上的规则扫描器,缺省情况下使用espree作为AST解析器.rules写好对于AST事件的回调,linter处理源代码之后会根据相应的事件来回调ru ...

  7. 双11特刊|十年磨一剑,云原生多模数据库Lindorm 2021双11总结

    ​前言 2021 年,转眼 Lindorm 已经在阿里发展了十年的时间,从基于 HBase 深度改造的 Lindorm 1.0 版本,到全面重构,架构大幅升级的 Lindorm 2.0 版本:从单一的 ...

  8. HTML中元素分类与对应的CSS样式特点

    元素就是标签,布局中常用的有三种标签,块元素.内联元素.内联块元素,了解这三种元素的特性,才能熟练的进行页面布局. 块元素 块元素,也可以称为行元素,布局中常用的标签如:div.p.ul.li.h1~ ...

  9. [FAQ] Win10 找到打开 hosts 文件

    1. Win+R 打开运行窗口. 2. 输入命令 C:\Windows\System32\drivers\etc 回车. Refer:windows hosts Link:https://www.cn ...

  10. 用Multisim验证简易测谎仪

    用Multisim验证简易测谎仪 测谎仪电路如下图所示: 节点1,2之间用10M欧的电位计代表人体表电阻,原理是撒谎出汗的话,体表电阻就小.Q1,Q2构成互补音频振荡器,振荡频率由R2.C1和R12共 ...