React将由三部分组成,其中,Redux是应用状态管理服务,React-Router用于路由映射,React View用于显示界面。

  我们使用Facebook推荐的create-react-app来进行项目初始化配置。首先确保系统已正确安装Node及Npm。

⒈使用npm安装create-react-app(全局安装)

npm install create-react-app -g

⒉初始化项目

d:
cd Coreqi
#直接创建ts环境的项目
create-react-app ts-react --scripts-version=react-scripts-ts

⒊运行项目

  初始化项目之后我们会得到一个名为ts-react的目录,让我们进入目录运行一下吧

cd ts-react
yarn start

  执行完该命令后会自动打开浏览器访问http://localhost:3000。

初始化一个React项目(TypeScript环境)的更多相关文章

  1. 初始化一个React项目

    1.create-react-app是一个通过npm发布的安装包,在确认Node.js和npm安装好之后,输入下面命令创建. 2.安装结束后,使用下面命令创建应用目录. 3.打开目录 4.运行项目 5 ...

  2. React环境配置(第一个React项目)

    使用Webpack构建React项目 1. 使用NPM配置React环境 NPM及React安装自行百度 首先创建一个文件夹,the_first_React 进入到创建好的目录,npm init,然后 ...

  3. 从零构建一个react+webpack+typescript的应用

    今天要完成在windows下从零开始构建一个react应用的任务 首先,新建一个文件夹,然后在该文件夹下使用命令npm init 初始化一个node项目. 然后安装所需依赖, npm i react ...

  4. (24/24) webpack小案例--自己动手用webpack构建一个React的开发环境

    通过前面的学习,对webpack有了更深的认识,故此节我们就利用前面相关知识自己动手用webpack构建一个React的开发环境,就算是一个小案例吧. 注:此处使用的开发工具是Webstorm. 1. ...

  5. 从零开始搭建一个react项目

    Nav logo 120 发现 关注 消息 4 搜索 从零开始搭建一个react项目 96 瘦人假噜噜 2017.04.23 23:29* 字数 6330 阅读 32892评论 31喜欢 36 项目地 ...

  6. 手把手教你用webpack3搭建react项目(开发环境和生产环境)(一)

    开发环境和生产环境整个配置源码在github上,源码地址:github-webpack-react 如果觉得有帮助,点个Star谢谢!! (一)是开发环境,(二)是生产环境. 一.首先创建packag ...

  7. react 工程起步 安装chrome 开发调试工具 react developer tools 及初建一个react 项目...

    1.安装react 开发工具 1.下载    chrome      react developer tools 下载地址:https://pan.baidu.com/s/1eSZsXDC  下载好是 ...

  8. 如何架构一个 React 项目?

    编程有点像搞园艺.比起竭力去对付BUG(虫子),我们更愿意把一切弄得整洁有序,以免最后落得个身在荒野丛林中.低劣的架构会拖我们的后腿,也会使得BUG更容易钻进系统里去. 想要对你的项目进行架构,方法有 ...

  9. 脚手架创建一个React项目

    一.安装 1.安装node.js 官网地址 https://nodejs.org/en/ 进入后点击下载,官方网站会根据你的系统类型推荐最适合你安装的版本.(如果已经安装了node.js跳过此步)如下 ...

随机推荐

  1. 深入浅出MYSQL数据库—思维导图[附下载链接]

    源文件下载地址:https://github.com/JluTiger/schoolRecruit2020

  2. C语言的柔性数组的实现及应用

    c编程的时候数组长度一般都是固定好的,实际上c还能实现变长数组.其实c99中确实是有变长数组的说法,C99中通过允许结构体中的最后一个成员是长度未知的数组实现变长数组,其定义格式如下: typedef ...

  3. 使用xshell-ssh连接服务器,报错:Xshell Socket error Event: 32 Error: 10053

    XShell连接CentOS系统时,报出Xshell Socket error Event: 32 Error: 10053..错误 有点烦人.. 操作:用SSH工具连接linux电脑出现的问题:Re ...

  4. 第07组 团队Git现场编程实战

    组员职责分工 团队成员 分工 杨明哲 爬数据,做网页 林兴源 合作编码完成了对美团数据的分析,分析出最有发展潜力的十佳好店 卞永亨 从大众点评分析出了服装商圈 林鑫 合作编码完成了对美团数据的分析,分 ...

  5. WIN7在计算机管理中修改用户名之后 文件夹名字不变怎么办?

      WIN7在计算机管理中修改用户名之后 文件夹名字不变?   可以新建一个管理员账户,起名字,然后删除旧的账户.保留原用户文件夹中的内容,以备不时之需.不要在控制面板的用户账户中修改用户名,修改之后 ...

  6. Python判断是否是闰年

    year = 2012 if year % 100 != 0 and year % 4 == 0: print('闰年') elif year % 100 == 0 and year % 400 == ...

  7. RabbitMQ 入门教程(PHP版) 第三部分:发布/订阅(Publish/Subscribe)

    发布/订阅 在上篇第二部分教程中,我们搭建了一个工作队列.每个任务之分发给一个工作者(worker).在本篇教程中,我们要做的之前完全不一样——分发一个消息给多个消费者(consumers).这种模式 ...

  8. php调用webservice报错Class 'SoapClient' not found(转)

    php在调用webservice时,报告如下类似错误: ( ! ) Fatal error: Class 'SoapClient' not found in E:/WebSrv/CI/system/l ...

  9. Python - Django - 在 CBV 中使用装饰器

    urls.py: from django.conf.urls import url from app02 import views urlpatterns = [ # app02 url(r'^app ...

  10. Python - Django - 添加首页尾页上一页下一页

    添加首页和尾页: views.py: from django.shortcuts import render from app01 import models def book_list(reques ...