首页 > 其他分享 >react保姆级搭建新项目

react保姆级搭建新项目

时间:2023-06-29 16:32:48浏览次数:34  
标签:return url react 保姆 error import message config 搭建


此文主要以ts+vite+router6+antd 快速搭建一个react项目,适用于初学者

一、项目搭建

采用pnpm,个人感觉比npm和yarn好用

npm i pnpm -g

采用vite方式 ,根据选择 react-ts

pnpm create vite

1.1 修改初始结构,删除多余文件

react保姆级搭建新项目_react

1.2 修改vite.config配置文件 配置别名

vite.config:

react保姆级搭建新项目_前端开发_02

import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'
import path from 'path';

export default defineConfig({
  plugins: [react()],
  resolve: {
    alias:{
      "@":path.resolve(__dirname,'./src')//配置@别名
    }
  },
})

标签:return,url,react,保姆,error,import,message,config,搭建
From: https://blog.51cto.com/u_16174484/6583605

相关文章

  • Flutter私服搭建之package查询
    温馨提示:这是一篇私有的package客户端查询的平台搭建文章,牵扯到python中的Django框架,虽和Flutter相关,但客户端的代码并没有关联,请您根据需要进行阅读。公有的package,对于一个Flutter开发者而言,再熟悉不过,比如常见的网络库dio,存储库shared_preferences等等,我们都可以在官网进行查找......
  • pytest接口自动化测试框架搭建的全过程
    pytest是Python的一种单元测试框架,可用来组织用例执行,用例断言,下面这篇文章主要给大家介绍了关于pytest接口自动化测试框架搭建的相关资料,文中通过实例代码介绍的非常详细,需要的朋友可以参考下一.背景Pytest目前已经成为Python系自动化测试必学必备的一个框架,网上也有很多......
  • Day05 5.1 Java环境搭建
    Day055.1Java环境搭建【一】Jdk的安装和配置【1】安装jdk是否需要再选择安装一个额外的JRE。这是可选的,因为之前安装的JDK中,已经包含了开发环境和JRE运行环境两部分,所以不必再安装一个JRE。【2】配置环境变量(1)新建JAVA_HOMEJAVA_HOMED:\ProgramFiles\Java\jdk-1......
  • 嵌入式-Qt开发环境搭建
    1.什么是QTSDK,QT,QTCreator(1)QTSDK包括QT库,QTCreator(IDE),QT工具(qmake等,qmake用于生产Makefile)(2)QT是基于C++的跨平台的应用程序框架,可以认为是一个库文件(3)QTCreator一款IDE2.搭建嵌入式-QT开发环境需要什么(1)QTCreator 一般在虚拟机的Li......
  • 自媒体后台搭建 —— 素材图片上传
    一、自媒体后台搭建1、搭建自媒体平台网关:leadnew-wemedia-gateway2、搭建自媒体微服务:leadnews-wemedia-service二、自媒体素材管理图片上传1、如何获得用户信息在自媒体网关过滤器filter中解析token,获取用户id,存入headerspackagecom.heima.wemedia.gateway.filter;......
  • 环境搭建
    使用idea2022   jdk1.81. 项目简介1.1 项目介绍云尚办公系统是一套自动办公系统,系统主要包含:管理端和员工端管理端包含:权限管理、审批管理、公众号菜单管理员工端采用微信公众号操作,包含:办公审批、微信授权登录、消息推送等功能项目服务器端架构:SpringBoot + MyBatisPlus +......
  • React学习时,outlet配置(token判定,页面path监听)
    尽管写过outlet路由的配置。考虑到token判定和路由页变更,我不了解v6是不是有更详解的做法。决定调一下配置,期望在任何页面异步更新时,token都可以在跳转前被检测到,防止无token跳转发生。为src文件配置v6版本:路由子组件App.jsimport{HashRouter,Routes,Ro......
  • windows 搭建flutter开发环境
    前言我的电脑是windows的,根据flutter实战所说,windows下安装flutter同时也要安装android,所以windows下的flutter开发环境搭建就包含两部分,安装flutter和安装androidstudio。设置flutter环境变量linux如下设置exportPUB_HOSTED_URL=https://pub.flutter-io.cnexportFLUTTER_STORA......
  • 直播平台怎么搭建,Android获取文本的宽度和高度
    直播平台怎么搭建,Android获取文本的宽度和高度方法一:先绘制文本所在的矩形区域,再获取矩形区域的宽度   Rectrect=newRect();  mPaint.getTextBounds(text,0,text.length(),rect);  canvas.drawRect(rect,mPaint);  floattextWidth1=rect.width(); ......
  • React - 判断当前点击是组件的外部或内部
    1.先获取当前要监听的那个组件的refimportReact,{useRef}from'react';//类组件获取this.Ref=React.createRef();//函数组件获取constRef=useRef();2.通过addEventListener来全局监听document.addEventListener("mousedown",(e)=>{if(Ref.contains(e.ta......