React+TS+Redux+Antd 学习笔记（项目搭建）

主要是视屏的学习笔记。
视频链接：

• https://www.bilibili.com/video/BV1Ba4y1H77E?p=8&spm_id_from=pageDriver

1. 搭建React + TS项目

设置国内yarn代理：

yarn config set registry https://registry.npm.taobao.org

移除原代理

yarn config delete proxy
npm config rm proxy
npm config rm https-proxy

安装cnpm镜像并使用代理registry

安装cnpm镜像
npm install -g cnpm --registry=https://registry.npm.taobao.org
使用代理registry
npm config set registry https://registry.npm.taobao.org

初始化项目：

yarn create react-app react-ts --template=typescript

启动项目

cd react-ts && yarn start

2. 修改App.tsx

使用ts类的形式修改主函数

import React, { Component } from 'react';
import './App.css';

class App extends Component<any, any>{
  render(){
    return (
      <>
        helloworld
      </>
    )
  }
}

export default App;

git链接：

https://gitee.com/MY-WT/react-ts-demo

3. 创建函数式组件

快捷键：rfc

import React from 'react';

const Lee = () => {
  return (
    <div>
      mytaowu
    </div>
  );
}

export default Lee;

App.tsx中进行引用

import React, { Component } from 'react';
import Lee from './Lee'

class App extends Component<any, any>{
  render(){
    return (
      <>
        helloworld
        <Lee></Lee>
      </>
    )
  }
}

export default App;