【React】配置别名路径@

news2024/10/5 13:10:31

别名路径配置

在这里插入图片描述

1. 路径解析配置(webpack)

CRA本身把webpack配置包装到了黑盒里无法直接修改,需要借助一个插件 - craco

步骤

在这里插入图片描述

  1. 安装craco
npm i -D @craco/craco
  1. 项目根目录下创建配置文件 craco.config.js
  2. 配置文件中添加路径解析配置
    在这里插入图片描述
const path = require('path')
module.exports = {
  // webpack配置
  webpack:{
    // 配置别名
    alias:{
      // 约定: 使用 @ 表示 src文件所在路径
      '@':path.resolve(__dirname,'src')
    }
  }
}
  1. 包文件package.json 中 配置启动和打包命令
    在这里插入图片描述
    在这里插入图片描述
  2. 启动项目 ,执行 npm run start

2. 路径联想配置(VsCode)

 VsCode的联想配置,需要我们在项目目录下添加 jsconfig.json 文件,
 加入配置之后VsCode会自动读取配置帮助我们自动联想提示
步骤
  1. 根目录下新增配置文件 jsconfig.json
  2. 添加路径提示配置
    在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1818155.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

Android低代码开发 - 直接创建一个下拉刷新列表界面

看了我Android低代码开发 - 让IDE帮你写代码这篇文章的小伙伴,大概都对Dora全家桶开发框架有基本的认识了吧。本篇文章将会讲解如何使用dora-studio-plugin快捷创建一个下拉刷新列表界面。 效果演示 这样直接通过图形界面的方式就创建好了下拉刷新上拉加载空态界面…

3. 打造个性化可爱怪物表情包:详细步骤教学

表情符号已经成为当今互联网对话中不可或缺的元素,一句话加上一个笑脸符号,语气就大不同。表情符号与我们一道稳步发展,成为鲜活和丰富情感的必要交流工具。通过表情符号,几个像素就能以有趣、清晰、能引起情感共鸣的方式表达我们…

d3dcompiler_43.dll是什么文件?怎么高效率的解决d3dcompiler_43.dll丢失问题

d3dcompiler_43.dll是什么文件?当你知道d3dcompiler_43.dll这个文件名字的时候,相信你是遇到了d3dcompiler_43.dll丢失的问题了!所以才会这样问,其实这就是一个普通的dll文件,对于电脑系统有着至关重要的作用&#xff…

100v 高耐压ldo 高压三端稳压芯片

100v 高耐压ldo 高压三端稳压芯片

【Android 11】AOSP Settings添加屏幕旋转按钮

前言 这里是客户要求添加按钮以实现屏幕旋转。屏幕旋转使用adb的命令很容易实现: #屏幕翻转 adb shell settings put system user_rotation 1 #屏幕正常模式 adb shell settings put system user_rotation 0这里的值可以是0,1,2&#xff0c…

pyinstaller打包exe多种失败原因解决方法

pyinstaller打包exe多种失败原因解决方法 目录 pyinstaller打包exe多种失败原因解决方法1、pyinstaller安装有问题1.1 安装pyinstaller1.2 采用anconda的环境启动 2、pyqt5与pyside6冲突2.1 打包生成.spec文件2.2 编辑spec文件 3、打包成功后打不开exe,exe闪退3.1 s…

网格重构技术在AI绘画中的革新作用

引言: 随着人工智能(AI)技术的飞速发展,艺术创作也迎来了前所未有的变革。AI绘画不仅改变了艺术家的创作方式,还为非专业人士开启了艺术创作的大门。在众多AI技术中,网格重构技术因其独特的作用和效果成为A…

【CH32V305FBP6】USBD HS 中断分析

文章目录 前言中断分析 USBHS_IRQHandler传输完成:USBHS_UIF_TRANSFERTOKEN_IN:发送完成TOKEN_OUT:接收完成 描述符:USBHS_UIF_SETUP_ACT总线复位:USBHS_UIF_BUS_RST总线挂起:USBHS_UIF_SUSPEND 前言 所有…

图文解析ASN.1中BER编码:结构类型、编码方法、编码实例

本文将详细介绍ASN.1中的BER编码规则,包括其编码机制、数据类型表示、以及如何将复杂的数据结构转换为二进制数据。通过本文的阅读,读者将对ASN.1中的BER编码有一个全面的理解。 目录 一.引言 二.BER编码基本结构 ▐ 1. 类型域(Type&#…

光伏气象站:智能驱动,助力光伏产业绿色发展

TH-FGF9在全球能源结构转型和环境保护的大背景下,分布式光伏发电以其清洁、可再生的特性,逐渐成为了能源领域的新宠。然而,光伏发电的效率受气象条件影响较大,如光照强度、温度、风速等因素都会对光伏电站的发电效率产生直接影响。…

flask实战之模板实现公共导航

基础实现 目标 在Flask中,使用模板继承和块(blocks)可以方便地提取公共导航菜单,使得您可以在多个页面上重用相同的导航结构。以下是一个基本示例,展示如何创建一个包含公共导航菜单的模板: 创建基础模板…

Python-Socket网络编程简单示例

# TCP 服务端程序 server.py # 导入socket 库 from socket import *# 主机地址为空字符串,表示绑定本机所有网络接口ip地址 # 等待客户端来连接 IP # 端口号 PORT 50000 # 定义一次从socket缓冲区最多读入512个字节数据 BUFLEN 512# 实例化一个socket对象 # 参…

实测完快手的AI视频「可灵」后,我觉得这才是第一个中国版Sora

6月6号,是快手的13周年生日。 在这一天,所有AI圈的人都想不到,快手在13周年之际,没有任何预兆、没有任何宣传,直接发布了他们的AI视频大模型。 可灵。 给我也干了个措手不及。 我当时正在看360的发布会,…

SD5510 单节锂离子电池充电器和恒定5V升压控制器芯片IC

一般描述 SD5510为一款移动电源专用的单节锂离子电池充电器和恒定5V升压控制器,充电部分集高 精度电压和充电电流调节器、预充、充电状态指示和充电截止等功能于一体,可以输出最大1A充电电流。而升压电路采用CMOS工艺制造的空载电流极低的VFM开关…

SpringBoot不用写Controller、不用写Service、不用建表,直接起飞是什么感觉

Spring Data REST 提供了一种简单的方式来暴露 JPA 实体为 RESTful 服务,这使得构建基于 REST 的数据服务变得非常快速和高效。下面是一个使用 Spring Data REST 构建通用架构的基本示例: 首先,我们需要创建一个实体类(例如&…

Centos离线安装Python3

目录 1.准备工作 2.解压python压缩包 3.编译 4.安装、更改环境变量 5.建立pip连接 使用的是Centos7服务器,Py版本是py3.9.0 1.准备工作 首先确保服务器中存在相关的编译器,例如GCC;这里不做过多叙述,需要者前往&#xff1a…

【全开源】旅行吧旅游门票预订系统源码(FastAdmin+ThinkPHP+Uniapp)

🌍旅游门票预订系统:畅游世界,一键预订 一款基于FastAdminThinkPHPUniapp开发的旅游门票预订系统,支持景点门票、导游产品便捷预订、美食打卡、景点分享、旅游笔记分享等综合系统,提供前后台无加密源码,支…

milvus的GPU索引

前言 milvus支持多种GPU索引类型,它能加速查询的性能和效率,特别是在高吞吐量,低延迟和高召回率的场景。本文我们将介绍milvus支持的各种GPU索引类型以及它们适用的场景、性能特点。 下图展示了milvus的几种索引的查询性能对比,…

40. 【Java教程】数据库编程

本小节我们将学习如何使用 Java 语言结合数据库进行编程。注意,学习本小节需要你有一定的 SQL 基础,了解 MySQL 数据库的 基础 CRUD 操作。 本小节我们将选择开源免费的 MySQL 5.7 作为数据库,可以去官网下载并安装 MySQL。 通过本小节的学…

nosql数据库的特点

NoSQL简介 NoSQL是一种不同于关系数据库的数据库管理系统设计方式,是对非关系型数据库的统称,它所采用的数据模型并非传统关系数据库的关系模型,而是类似键/值、列族、文档等非关系模型。NoSQL数据库没有固定的表结构,通常也不存在连接操作,也没有严格遵守ACID约束。因此…