依次输入命令:

npm install -g create-react-app
create-react-app react16 cd my-app
npm start

在浏览器中输入 local:3000 即可查看项目运行效果:

* 使用 create-react-app 创建项目成功在命令行中有提示信息如下,分别给出了项目启动、打包、测试和弹出配置文件的命令:

Success! Created react16 at /Users/wangxi/.Trash/react16/react16
Inside that directory, you can run several commands:
yarn start
Starts the development server.
yarn build
Bundles the app into static files for production.
yarn test
Starts the test runner.
yarn eject
Removes this tool and copies build dependencies, configuration files
and scripts into the app directory. If you do this, you can’t go back!
We suggest that you begin by typing:
cd react16
yarn start
Happy hacking!

参考: Creating a New Application

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

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

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

  2. 创建react项目的几种方法

    前言: 构建React项目的几种方式: 构建:create-react-app 快速脚手架 构建:generator-react-webpack 构建:webpack一步一步构建 1)构建:creat ...

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

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

  4. 创建react项目并集成eslint/prettier/commit-lint

    创建 react 项目 npx create-react-app jira-new --template typescript 如果不想使用 TS,而要用 JS 的话,则删除 -template ty ...

  5. 创建react项目

    npm搭建React项目 React官网提供最简便的方法是使用create-react-app npx create-react-app my-app cd my-app npm start 也可以自 ...

  6. 用rekit创建react项目

    第一步  先进入github.com 然后搜索rekit 往下滑 1 . 先全局安装 npm install -g rekit 2 . 进入自己想要创建项目文件的目录输入 rekit create / ...

  7. create-react-app创建react项目失败!

    create-react-app my-app 用管理员运行cmd,问题依然. 打开日志,看到错误详细信息如下 32189 verbose unlock done using C:\Users\fen ...

  8. create-react-app创建react项目 css模块化处理

    用的css预处理器用sass,其他大同小异. 用create-react-app创建项目,执行npm run eject弹出配置文件(此操作不可逆): 配置sass,用的最新的CRA,webpack4 ...

  9. webpack 4.X 创建 react项目

    1. 新建一个文件夹2. 运行 npm init -y 快速初始化项目3. 在跟目录创建src文件夹 dist文件夹4. 在src下创建 index.html main.js // index.htm ...

  10. npm创建react项目

    1:win+R 输入cmd ,打开cmd面板 2:安装cnpm npm install -g cnpm --registry=https://registry.npm.taobao.org 3:安装r ...

随机推荐

  1. 算法-----数组------ 数组中的第K个最大元素

    在未排序的数组中找到第 k 个最大的元素.请注意,你需要找的是数组排序后的第 k 个最大的元素,而不是第 k 个不同的元素. 示例 1: 输入: [3,2,1,5,6,4] 和 k = 2 输出: 5 ...

  2. Service ANR问题

    错误堆栈: ActivityManager: ANR in com.oppo.reader PID: 8071 Reason: executing service com.oppo.reade//co ...

  3. 「日常训练」Mike and Feet(Codeforces Round #305 Div. 2 D)

    题意 (Codeforces 548D) 对一个有$n$个数的数列,我们要求其连续$x(1\le x\le n)$(对于每个$x$,这样的连续group有若干个)的最小数的最大值. 分析 这是一道用了 ...

  4. 2015年开源前端框架盘点TOP20

    2015年,榜单根据github上star数作为排名依据.(榜单中大部分为组件式框架, react.Angular等基础框架不在此篇讨论) 1.Bootstrap 类别/语言:HTML.CSS.Jav ...

  5. python学习总结----异常处理

    相关概念 - 错误:程序运行之前的语法错误,如:关键字.缩进不齐.括号不成对. - 异常:在程序运行过程中出现的问题,如:除数为0.对象属性不存在等. 异常处理 - 说明:异常处理可以理解为特殊的流程 ...

  6. Visual Studio Code 配置Go 开发环境最简单的方法!!!

    由于大家都知道的原因,在国内如果想访问go等各种资源,都会遇到某种不可预知的神奇问题.导致在VS Code中安装 go 各种插件都会失败. 于是乎,网上就出现了各种各样的解决方案:什么手动git cl ...

  7. 当我们在安装tensorflow时,我们在安装什么?- Intro to TF, Virtualenv, Docker, CUDA, cuDNN, NCCL, Bazel

    (Mainly quoted from its official website) Summary: 1. TensorFlow™ is an open source software library ...

  8. Daily Scrum02 11.30

    纵然编译大作业压顶,大家还是顶住压力,保证了软工项目的持续进行. Member Today's Task Tomorrow's Task 李孟 Task856 熟悉单元测试方法熟悉单元测试方法 Tas ...

  9. C/C++-左值、右值及引用

    目录 1.左值and右值 2.引用 3.左值引用的用途 4.std::move和std::swap C和C++中定义了引用类型(reference type),存在左值引用(lvalue refere ...

  10. penLDAP学习笔记

    LDAP协议 目录是一组具有类似属性.以一定逻辑和层次组合的信息.常见的例子是通讯簿,由以字母顺序排列的名字.地址和电话号码组成.目录服务是一种在分布式环境中发现目标的方法.目录具有两个主要组成部分: ...