zoukankan      html  css  js  c++  java
  • React 环境搭建及页面调试方法

    React 环境搭建及页面调试方法

    |作者:RexFang

    |出处:http://www.cnblogs.com/rexfang/

    |关于作者:Java 程序员一枚

    |版权:本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接。如有问题,可以邮件:fangruitao.work@foxmail.com

    注:本文件主要介绍 React 入门环境的搭建,以及调试 Demo 的基本方法,更加完整的信息,请前往官网查看:https://facebook.github.io/react/docs/hello-world.html

    安装 Nodejs

    • 下载地址:https://nodejs.org/en/download/
    • 默认安装即可,安装完成后,WIN+R 输入 cmd,打开命令行
    • 输入 node -v,可以看到 Nodejs 的版本信息
    • 输入 npm --version,可以看到 npm 的版本信息

    安装 React

    • 输入 npm install -g create-react-app,等待一段时间以完成 React 的安装

    创建 React 应用

    • 创建一个文件夹,在命令行,进入前面创建的文件夹,输入 create-react-app my-app 创建 React 应用, 应用名称为“my-app”,等待一段时间以完成 React 应用的创建

    React 应用的启动和关闭

    • 应用创建完成后,在命令行输入 cd my-app,进入应用目录,输入 npm start 即可启动 my-app React 应用
    • 启动完成后,在浏览器输入 http://localhost:3000/ 即可访问到 React 应用
    • 如果要关闭 React 应用,只需要在命令行按下 Ctrl+D ,此时会提示 “终止批处理操作吗(Y/N)?” ,按提示输入 Y 回车即可关闭 React 应用(发现输入 N 回车都可以关闭应用,这也许是一个 BUG,不过不影响我们学习)

    访问自己写的 JS

    • 应用创建完成后,有一个实例的 JS 文件 App.js,被 index.js 文件所引用,后续可以自己模仿 App.js 文件写自己的 JS,然后在 index.js 文件中替换掉 APP.js 的引用,即可在浏览器看到自己写的 JS 的效果

      例如:
               先在 src/demo/demo01 目录先创建 HelloReact.js 文件
               修改 index.js 文件,引入 import HelloReact from './demo/demo01/HelloReact',
               修改 ReactDOM.render(, document.getElementById('root'));

  • 相关阅读:
    hdu3709(数位dp)
    2012天津E题
    2012天津C题
    hdu1754(splay)
    赤裸裸的splay平衡树
    hdu(预处理+线段树)
    uva11922(强行用rope替代spaly)
    lightoj 1370 欧拉函数
    poj3294 出现次数大于n/2 的公共子串
    poj2774 后缀数组2个字符串的最长公共子串
  • 原文地址:https://www.cnblogs.com/rexfang/p/7441110.html
Copyright © 2011-2022 走看看