1.安装脚手架

现在使用较多的就是这三种脚手架工具:

  1. react-boilerplate
  2. react-redux-starter-kit
  3. create-react-app

我使用的是第三种,facebook官方开发的脚手架

npm install -g create-react-app

2.创建React项目

create-react-app my-app

主要依赖 react, react-dom, react-scripts

生成目录结构为:

3.运行React项目

npm start

4.使用ChromeReack插件调试工具

在chrome浏览器中添加拓展程序

自行下载文件

链接:https://pan.baidu.com/s/1T5gtbf3vIPOCkYiMmxFpqw 密码:oke5

React(一)使用脚手架创建React项目的更多相关文章

  1. 利用 Create React Native App 快速创建 React Native 应用

    本文介绍的 Create-React-Native-App 是非常 Awesome 的工具,而其背后的 Expo 整个平台也让笔者感觉非常的不错.笔者目前公司是采用 APICloud 进行移动应用开发 ...

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

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

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

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

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

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

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

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

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

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

  7. 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 & ...

  8. 使用vue-cli脚手架创建的项目结构详解

    项目整体目录结构预览 src目录 src整体结构 开发过程中基本上操作都在该目录下进行操作的,项目所有源码都是在这个目录下 main.js文件,项目核心文件 App.vue文件,项目入口文件 rout ...

  9. 用脚手架创建vue项目

    .创建文件地址 首先创建一个文件夹,我用的HBuilder编辑器 , 然后把文件夹拖入编辑器 , 在你创建的文件夹里面打开cmd 2.输入安装命令 : 1). npm install --global ...

随机推荐

  1. Python动态语言的特性

    一.动态语言相关概念 1.1 动态语言 在运行时代码可以根据某些条件改变自身结构 可以在运行时引进新的函数.对象.甚至代码,可以删除已有的函数等其他结构上的变化 常见的动态语言:Object-C.C# ...

  2. MySQL查看SQL语句执行效率

    Explain命令在解决数据库性能上是第一推荐使用命令,大部分的性能问题可以通过此命令来简单的解决,Explain可以用来查看 SQL 语句的执行效 果,可以帮助选择更好的索引和优化查询语句,写出更好 ...

  3. 第十五节:HttpContext五大核心对象的使用(Request、Response、Application、Server、Session)

    一. 基本认识 1. 简介:HttpContext用于保持单个用户.单个请求的数据,并且数据只在该请求期间保持: 也可以用于保持需要在不同的HttpModules和HttpHandlers之间传递的值 ...

  4. Geometric regularity criterion for NSE: the cross product of velocity and vorticity 4: $u\cdot \om$

    在 [Berselli, Luigi C.; Córdoba, Diego. On the regularity of the solutions to the 3D Navier-Stokes eq ...

  5. 深入理解 LINQ to SQL 生成的 SQL 语句

    Ø  简介 在 C# 中与数据交互最常用的语句就是 LINQ 了,而 LINQ to SQL 是最直接与数据库打交道的语句,它可以根据 LINQ 语法生成对应的 SQL 语句,在数据库中去执行.本文主 ...

  6. 在JS中如何判断所输入的是一个数、整数、正数、非数值?

    1.判断是否为一个数字: Number(num)不为 NaN,说明为数字 2. 判断一个数为正数: var num=prompt("请输入:"); if(Number(num)&g ...

  7. MVC5 Entity Framework学习

    MVC5 Entity Framework学习(1):创建Entity Framework数据模型 MVC5 Entity Framework学习(2):实现基本的CRUD功能 MVC5 Entity ...

  8. Centos7 安装 python2.7

    Centos7 安装 python 2.7.15 和 pip  1.先安装 GCC 包,如果没安装 GCC包 就输入以下命令行安装: (*注:以下记得使用 su 权限) yum install gcc ...

  9. webpack学习记录

    webpack 中文网站  https://webpack.docschina.org/ webpack1 有编译打包 模块热更新 代码分割 文件处理功能 webpack2 tree Shaking( ...

  10. maven 一些整理

    1.发布jar包到私服,需要进入项目目录 发布jar   :mvn deploy 发布源码 :mvn source:jar deploy,这个需要依赖一个maven插件: <plugin> ...