搭建react项目,react+ts,react+typescript
1、使用create-react-app my-react
目前使用create-react-app会遇到以下错误提示:
该错提示我们 您正在运行 create-react-app 5.0.0
,它落后于最新版本 (5.0.1)。
react
不再支持全局安装 Create React App
。
让我们先把 Create React App
删除。我们运行npm uninstall -g create-react-app
然后通过 官方提供的文档地址,查看新的创建react项目的方式
链接: https://create-react-app.dev/docs/getting-started/
2、然后通过 npm init react-app my-react
创建项目,运行报错如下:
该错提示我们 网络存在异常
,主要原因是 npm
在国内不好用,所以这时候就要靠 国内的淘宝镜像了。
淘宝镜像安装如下: npm install -g cnpm -registry=https://registry.npm.taobao.org
;
3、安装好淘宝镜像运行 cnpm init react-app my-react
结果如下:
提示我们安装成功,以及运行方式,打包方式等。
提示我们安装成功,以及运行方式,打包方式等。
提示我们安装成功,以及运行方式,打包方式等。
提示我们安装成功,以及运行方式,打包方式等。
提示我们安装成功,以及运行方式,打包方式等。
提示我们安装成功,以及运行方式,打包方式等。
新版react安装及问题解析结束了。如果有用,请点个爱心吧
、
、
(1)后续:
想要使用ts方式的react,即:typescript和react同时安装,可以使用官方提供的npx;
如果想要使用 npx 安装 typescript
,命令:npx create-react-app my-app --template typescript
,
会发生安装不成功的问题,原因:npm(npx) 的包 是国外的,所以会出现网络问题,导致失败
。
解决方式
1、查看
npm的镜像来源
npm config get registry
// 默认是:https://registry.npmjs.org/
2、修改成淘宝的镜像源
npm config set registry https://registry.npm.taobao.org
3、运行 npx create-react-app my-app --template typescript
这时候你就如愿以偿了 react + ts
项目就完成了
搭建react项目,react+ts,react+typescript相关推荐
- react项目添加ts
新项目创建 1.react + antd + ts yarn create react-app xxx --template typescript 安装antd yarn add antd 2.rea ...
- 在vue项目或者react项目中实现图形验证码功能
效果演示 使用说明 我对这个图形验证码做了一个组件的封装,如果你的项目是vue项目就粘贴vue章节的组件代码,是react项目就粘贴react章节的组件代码.组件的使用很简单,只需要传递一个prop, ...
- React 全家桶(react脚手架 redux react-redux react-router-dom ui库 reactHook)含 自定义hook的方法及使用
文章目录 React 入门 React 简介 React 为何物 为何学习 React React 初体验 来一发 Hello React 创建虚拟 DOM 的两种方式:JS 和 JSX 虚拟 DOM ...
- vue使用ts 引入组件_vue项目中使用ts(typescript)入门教程
最近项目需要将原vue项目结合ts的使用进行改造,这个后面应该是中大型项目的发展趋势,看到一篇不错的入门教程,结合它并进行了一点拓展记录之.本文从安装到vue组件编写进行了说明,适合入门. 1.引入T ...
- react项目搭建,步骤最全,附源码git地址(react+router+typescript+redux+axios+antdesign+mock+eslint)
企业级react项目搭建流程,基于官网推荐脚手架create-react-app搭建的项目基本框架,在该基础上增加项目所需要的功能插件等.代码git地址base分支:https://github.co ...
- 搭建react项目 搭建ts react项目 使用vite搭建react项目
创建react 项目 注意: 网上有一些生成react 的方法,但是也有一些是过时的. 使用官方脚手架creact-react-app 全局安装 creact-react-app 这个脚手架 这个脚手 ...
- 搭建react项目教程(二)
搭建react项目教程(二) 一:概述 二:配置 1:配置依赖包 2:添加与后台交互的配置文件 3:封装API调用方法 4:与后台交互 5:启动项目验证接口 一:概述 1:书接上文搭建react项目教 ...
- 前端项目搭建部署全流程(一):搭建React项目
1.前言 前段时间突发一个想法,想尝试从零开始搭建一个React项目模板,发布到GitHub,再编写脚手架命令拉取模板以及编写脚本命令快速生成业务模块,然后再用这个模板结合之前的一套组件库,完成编译打 ...
- React项目中应用TypeScript
说说如何在React项目中应用TypeScript? 一.前言: 使用 TypeScript 编写 React 代码,除了需要 TypeScript 这个库之外,还需要安装 @types/react. ...
最新文章
- windows10 查看 nvidia driver cuda 版本
- python基础教程学习笔记十二
- 雅克比迭代法求方程组的解(Python实现)
- linux 目标文件格式,Linux工具 - NM目标文件格式分析
- 【MySQL】AUTO_INCREMENT只能应用于数值类型的列,且该列需要被索引
- 热冗余冷冗余_冗余支架
- HTML画笔移出画布停止,html5 canvas画布无法清除
- Netty4实战 - TCP粘包拆包解决方案
- Mysql 更改密码详解及设置免密登录
- 高等代数——大学高等代数课程创新教材(丘维声)——1.2笔记+习题
- FCM算法与K-means 算法
- 微电子学与计算机发表周期,计算机核心期刊发表周期是多少?
- 爬虫系列学习之爬取西瓜视频
- ssh免密报错:Could not resolve hostname : Name or service not known
- [siggraph13]《命运》的实时渲染技术
- 配置mpls vpn基本组网-hub and spoke
- 大专计算机专业一般是几年制,大专需要读几年
- java中ofd文件转pdf_OFD版式文档Java开发组件(iOFD)
- 电子数据证据的证据能力及证明力研究
- php mcrypt_encrypt(),mcrypt_encrypt