使用vite搭建react-ts项目

105 阅读1分钟
  1. 使用vite创建项目,只需要执行一条命令即可:

     npm create vite@latest
    

image.png

2.配置sass:执行npm install sass即可;

1)main.ts文件中的'index.css'更新为 'index.scss';
   (2)vite.config.js中配置全局样式:

image.png

3.配置路径别名'@'

(1)执行 npm i @types/node --save-dev即可;
(2)vite.config.js文件配置路径别名;
(3)tsconfig.json文件配置路径别名解析;

image.png

image.png

4.axios请求封装,执行以下命令下载安装依赖

npm install axios @types/axios

5.解决跨域,需要在vite.config.ts中配置代理,其中需要分别配置3个文件,分别是.env.development、.env.production、.env.qa;

image.png 6.安装antd

安装命令:npm install antd --save
Antd官方地址:https://ant-design.antgroup.com/docs/react/use-with-vite-cn

安装icon命令: npm install @ant-design/icons --save
icon官方地址: https://ant-design.antgroup.com/components/icon-cn

image.png