React教程(-一 ) -- 快速构建React开发环境

React 初接触

一. react的安装

1). 使用方法
可以直接下载使用 <a href="http://facebook.github.io/react/ ">http://facebook.github.io/react/ </a>下载最新
2). 直接使用BootCDN的React CDN库.

<script src="https://cdn.bootcss.com/react/15.4.2/react.min.js"></script>
<script src="https://cdn.bootcss.com/react/15.4.2/react-dom.min.js"></script>
<script src="https://cdn.bootcss.com/babel-standalone/6.22.1/babel.min.js"></script>

在.html 文件中直接引用

  • react.min.js - React 的核心库
  • react-dom.min.js - 提供与 DOM 相关的功能
  • babel.min.js - Babel 可以将 ES6 代码转为 ES5 代码,
    这样我们就能在目前不支持 ES6 浏览器上执行 React 代码。Babel 内嵌了对 JSX 的支持。通过将 Babel 和 babel-sublime 包(package)一同使用可以让源码的语法渲染上升到一个全新的水平。

如果我们需要使用 JSX,则 script标签的 type 属性需要设置为 text/babel。

    <script type="text/babel">
        ReactDOM.render(
            <h1>Hello, world!</h1>,
            document.getElementById('example')//将一个 h1 标题,插入 id="example" 节点中
        );
    </script>

二. 使用npm来安装React

系统要支持node.js和npm
先验证有没有安装
node -v
npm -v

国内使用npm速度很慢,可以使用淘宝镜像cnpm命令代替npm

 npm install -g cnpm --registry=https://registry.npm.taobao.org

这样就可以使用cnpm来安装模块了

 cnpm install [name]

使用create-react-app快速构建React 开发环境
create-react-app 是来自于 Facebook,通过该命令我们无需配置就能快速构建 React 开发环境。

create-react-app 自动创建的项目是基于 Webpack + ES6 。

执行以下命令创建项目:

$ cnpm install -g create-react-app
$ create-react-app my-app
$ cd my-app/
$ npm start

你可以在 <code>src/App.js</code> 文件中修改。

如果我在文件中需要使用react-routes-dom
使用yarn add react-router-dom添加依赖 会在package.json 的dependencies 显示 在node_module中也会有此文件夹

这些东西官网上面都有 , 但是不要只是看,要动手写 ,自己算是刚接触react 做个笔记吧

©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • 1 Webpack 1.1 概念简介 1.1.1 WebPack是什么 1、一个打包工具 2、一个模块加载工具 3...
    Kevin_Junbaozi阅读 11,786评论 0 16
  • 我们先来直观认识React,对任何而一种工具,只有使用才能够熟练掌握,React也不例外。通过多Reac...
    六个周阅读 4,949评论 3 18
  • 不管今天金融发展的如何令人眼花缭乱,有多少衍生品,你都得承认,股票是所以衍生品的基础,所以量化选股是最重要也是最基...
    籍雨亭阅读 1,265评论 0 0
  • 下雪了,2018年的第一场雪,主要是雪子,地面是厚厚一层冰,看到雪估计好开心了,因为一直念叨要打雪仗的。早晨我被折...
    Jerryboy阅读 1,315评论 0 0
  • 昨夜做了一个梦,梦到了自己可以与胡歌同台,还梦到了一个人,从中领悟到了些许道理。他,和想象中的一般无二,不只是相交...
    小麦cheng阅读 1,643评论 0 0

友情链接更多精彩内容