搭建react开发环境的准备工作

1. node.js 稳定版本

2. 安装cnpm,用cnpm代替npm

3. 用yarn替代npm

yarn的安装:npm install -g yarn

搭建react开发环境的第一种方法(老-现在推荐)

1. 安装脚手架工具  只需要安装一次

  npm install -g create-react-app /  cnpm install -g create-react-app

2. 创建项目

  找到项目要创建的目录:

  create-react-app reactname

3. cd到项目里面

  npm start / yarn start 运行项目

  npm run build / yarn build 生成项目

搭建react开发环境的第二种方法(新-未来推荐)

1. 找到项目要创建的目录执行

  npx create-react-app reactdemo

  包括的步骤:

    a. 安装 npm install -g create-react-app

    b. 创建 create-react-app reactname

    c. 删除

npx介绍

npm v5.2.0引入的一条命令(npx),引入这个命令的目的是为了提升开发者使用包内提供的命令行工具的体验。

react --- 搭建环境的更多相关文章

  1. webpack+react搭建环境

    近日自己项目遇到需要用webpack搭建react环境,查了挺多 ,自己总结一下 1.下载安装最新版node.js(https://nodejs.org/en/) 2.主要看自己网络情况,可以选择安装 ...

  2. 史上最全Windows版本搭建安装React Native环境配置

    史上最全Windows版本搭建安装React Native环境配置 配置过React Native 环境的都知道,在Windows React Native环境配置有很多坑要跳,为了帮助新手快速无误的 ...

  3. 史上最详细Windows版本搭建安装React Native环境配置 转载,比官网的靠谱亲测可用

    史上最详细Windows版本搭建安装React Native环境配置   2016/01/29 |  React Native技术文章 |  Sky丶清|  95条评论 |  33530 views ...

  4. React 入门学习笔记整理(一)——搭建环境

    使用create-react-app脚手架搭建环境 1.安装node .软件下载地址:https://nodejs.org/en/,我下的推荐的版本. 安装之后测试是否安装成功.windows系统下, ...

  5. 使用Yarn+Webpack+Babel6搭建React.js环境

    使用Yarn+Webpack+Babel6搭建React.js环境 Facebook开源的React.js已经改变了世人对前端UI的思考方式.这种基于组件方式的优势之一,就是使View更加的简单,因为 ...

  6. Mac中搭建 iOS 的 React Native 环境

    手把手教你在Mac中搭建iOS的 React Native环境 http://www.cnblogs.com/damnbird/p/6074607.html 准备工作 1.你需要一台Mac电脑..(这 ...

  7. 详解 Webpack+Babel+React 开发环境的搭建

    1.认识Webpack 构建应用前我们先来了解一下Webpack, Webpack是一个模块打包工具,能够把各种文件(例如:ReactJS.Babel.Coffeescript.Less/Sass等) ...

  8. Webpack笔记(二)——搭建React开发环境

    前几天一直在学习webpack,总算比之前学习的时候有了点收获,所以在昨天发布了一篇webpack入门笔记,今天继续使用webpack练了练手,搭建了一个React开发环境,如果还不熟悉的童鞋可以看一 ...

  9. 史上最详细Windows版本搭建安装React Native环境配置

    说在前面的话: 感谢同事金晓冰倾情奉献本环境搭建教程 之前我们已经讲解了React Native的OS X系统的环境搭建以及配置,鉴于各大群里有很多人反应在Windows环境搭建出现各种问题,今天就特 ...

随机推荐

  1. java验证码生成

    第一种方式:纯代码 先写jsp: 在编写CaptServlet: package cn.itcast.web.controller; import java.awt.Color; import jav ...

  2. Servlet实践--HelloWorld

    Servlet规范是一套技术标准,包含与Web应用相关的一系列接口,而具体的Servlet容器负责提供标准的实现,如Tomcat. Servlet的实例对象由Servlet容器负责创建,Servlet ...

  3. 去除CKFinder版权提示信息

    CkFinder版权提示有两个地方,分别在树形列表下方和文件列表框上部,可以通过修改CSS来隐藏内容 因原始JS文件中的文本都是编码过的,类似 var x="\103\x6f\156\x6e ...

  4. python语法_集合

    集合:不同的元素(不可hash)组合在一起的就叫做集合,去掉重复的,以空字符返回,无序的 可以分为可变集合和不可变集合(frozenset) 创建: s = set('gm gyx') print(s ...

  5. 获取node异步执行结果的方式

    拿数据库操作举例: var connection = mysql.createConnection(); connection.query(sql,function(err,rows){xxx} ); ...

  6. hadoop 学习笔记(第三章 Hadoop分布式文件系统 )

    map->shuffle->reduce map(k1,v1)--->(k2,v2) reduce(k2,List<v2>)--->(k2,v3) 传输类型:org ...

  7. Python全栈-magedu-2018-笔记4

    第三章 - Python 内置数据结构 元组tuple 一个有序的元素组成的集合 使用小括号 ( ) 表示 元组是不可变对象 元组的定义 初始化 定义 tuple() -> empty tupl ...

  8. BZOJ 1257 - 余数之和 - [CQOI2007]

    题目链接:https://www.lydsy.com/JudgeOnline/problem.php?id=1257 题意: 给定正整数 $n,k$,求 $(k \bmod 1) + (k \bmod ...

  9. js基础--高阶函数(map,reduce,filter,sort)

    高阶函数 一个函数可以接收另一个函数作为参数,这种函数就称之为高阶函数,编写高阶函数,就是让函数的参数能够接收别的函数. function add (x,y,f){return f(x)+f(y)} ...

  10. 缓存机制 ehcache、redis

    本文主要记录ehcache和redis实现缓存(redis版本号:5.0.3) 一.ehcache 1.ehcache:用来管理Java中缓存的轻量级工具,其核心通过CacheManager使用,一般 ...