react脚手架创建项目,配置别名(alias)

React脚手架项目使用 react-scripts 封装了webpack配置,所以我们需要通过 config-overrides 或者 eject 的方式来修改webpack配置

可以的话 ,创建项目的时候可以使用vite  ,我这是老项目屎山 懒得迁移 ,但还得改呀 

## 1. 安装依赖 : 

npm install react-app-rewired customize-cra --save-dev

## 2. 根目录创建一个 config-overrides.js

const { override, addWebpackAlias } = require('customize-cra');
const path = require('path');module.exports = override(addWebpackAlias({['@']: path.resolve(__dirname, 'src')})
);

## 3. 修改 package.json 中的 scripts,将原本的 react-scripts 替换为 react-app-rewired

"scripts": {"start": "react-app-rewired start","build": "react-app-rewired build","test": "react-app-rewired test",
}

## 结语 : 可以在React脚手架项目中成功配置别名 @,将其指向 src 目录

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

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

相关文章

通过filebeat实现对docker服务的通用日志收集

平台 依赖 linux docker docker-compose 或者 docker compose 镜像 docker.elastic.co/beats/filebeat:8.12.2 docker.elastic.co/beats/kibana:8.12.2 docker.elastic.co/beats/elasticsearch:8.12.2 正文 背景 对于有自建机房的公司来说,如果公司的运维技术…

Stable Diffusion使用ControlNet:IP-Adapter实现图片风格迁移

IP-Adapter 全称是 Text Compatible Image Prompt Adapter for Text-to-Image Diffusion Models(文本到图像扩散模型的文本兼容图像提示适配器),是腾讯研究院出品的一个新的ControlNet模型,旨在使预训练的文本到图像扩散模型能够生…

【06】JAVASE-数组讲解【从零开始学JAVA】

Java零基础系列课程-JavaSE基础篇 Lecture:波哥 Java 是第一大编程语言和开发平台。它有助于企业降低成本、缩短开发周期、推动创新以及改善应用服务。如今全球有数百万开发人员运行着超过 51 亿个 Java 虚拟机,Java 仍是企业和开发人员的首选开发平台。…

最全GPTs使用教程+Prompt预设词教程

使用指南 直接复制使用 可以前往已经添加好Prompt预设的AI系统测试使用(可自定义添加使用) https://ai.sparkaigf.com 现已支持GPTs 雅思写作考官 我希望你假定自己是雅思写作考官,根据雅思评判标准,按我给你的雅思考题和对应…

从零入门区块链和比特币(第三期)

欢迎来到我的区块链与比特币入门指南!如果你对区块链和比特币感兴趣,但不知道从何开始,那么你来对地方了。本博客将为你提供一个简明扼要的介绍,帮助你了解这个领域的基础知识,并引导你进一步探索这个激动人心的领域。…

一些基础知识FK

1. 群体稳定性指数PSI 通过 PSI(Population Stability Index) 指标,可以得到不同样本下,模型在各分数段分布的稳定性。用于衡量两个群体(比如两个时间点、两个子群体等)之间稳定性的指标。通常PSI被用于评估信用风险模型、预测模型等在不同时间点或不同群…

安装配置Maven(idea里面配置)

放在这个路径下(如果需要可以免费发给你,dd我就好了) D:\IearnSoftware\maven\apache-maven-3.6.1-bin.zip(我自己的路径下面,防止忘记) 1.首先测试maven在不在,配置对不对 mvn -v 这样就是成…

STM32HAL库++ESP8266+cJSON连接阿里云物联网平台

实验使用资源:正点原子F1 USART1:PA9P、A10(串口打印调试) USART3:PB10、PB11(WiFi模块) DHT11:PG11(采集数据、上报) LED0、1:PB5、PE5&#xff…

【微信小程序调用百度API实现图像识别实战】-前后端加强版

前言:基于前面两篇图像识别项目实战文章进行了改造升级。 第一篇 入门【微信小程序调用百度API实现图像识别功能】----项目实战 第二篇 前后端结合 【微信小程序调用百度API实现图像识别实战】----前后端分离 这一篇主要讲述的是在第二篇的基础上新增意见反馈功能&a…

第72天:漏洞发现-Web框架中间件联动GobyAfrogXrayAwvsVulmap

案例一:某 APP-Web 扫描-常规&联动-Burp&Awvs&Xray Acunetix 一款商业的 Web 漏洞扫描程序,它可以检查 Web 应用程序中的漏洞,如 SQL 注入、跨站脚本攻击、身份验证页上的弱口令长度等。它拥有一个操作方便的图形用户界 面&#…

实验8 NAT配置

实验8 NAT配置 一、 原理描述二、 实验目的三、 实验内容1.实验场景2.实验要求 四、 实验配置五、 实验步骤2.静态NAT配置3.NAT Outbound配置4.NAT Easy-IP配置 一、 原理描述 2019年11月26日,全球43亿个IPv4地址正式耗尽,这意味着没有更多的IPv4地址可…

Taro引入echarts【兼容多端小程序(飞书/微信/支付宝小程序)】

近期接到公司新需求,开发飞书小程序,并且原型中含有大量的图表,本想使用飞书内置图表组件 —— chart-space,但官方表示已经停止维护了,无奈之下,只能另寻他路,于是乎,图表之王&…

【Godot4.2】自定义Todo清单类 - myTodoList

概述 在写myList类的时候,就想到可以写一个类似的Todo清单类。 基础思路 本质还是在内部维护一个数组,在其基础上进行增删改查操作的封装为了方便存储数据,编写一个自定义内置类TodoItem,内部数组就变成了Array[TodoItem]类型的…

【Flutter】GetX

前言 状态管理 / 路由管理 / 依赖管理 这三部分之间存在联系 参考文章 建议看官网文章,很详细 ,pub.dev搜索get pub.dev的文档 状态管理文章相关链接 状态管理 案例 实现一个计算器,运用GetX去管理它 构建界面 构建一个计算器界面 …

GateWay具体的使用之全链路跟踪TraceId日志

1.创建全局过滤器,在请求头上带入traceId参数,穿透到下游服务. package com.by.filter;import cn.hutool.core.collection.CollUtil; import cn.hutool.core.util.IdUtil; import cn.hutool.core.util.ObjectUtil; import cn.hutool.jwt.JWTValidator;…

数据结构1(初):时间复杂度和空间复杂度

目录 1、引言 1.1、什么是数据结构? 1.2、什么是算法? 1.3、如何学好数据结构和算法 ? 2、算法效率 2.1、如何衡量一个算法的好坏 2.2、算法的复杂度 3、时间复杂度 3.1、时间复杂度的概念 3.2、大O的渐进表示法 3.3、常见时间复杂…

C语言自定义类型【联合体与枚举】

文章目录 1.联合体1.1联合体的声明1.2联合体的特点1.3联合体的大小计算联合体的使用案例 2.枚举2.1枚举类型的声明2.2枚举类型的优点(为什么使用枚举)2.3枚举类型的使用 结语 1.联合体 1.1联合体的声明 和结构体一样,联合体也是由一个或多个成员构成,同…

Atcoder Beginner Contest351 A-E Solution题解

文章目录 [A - The bottom of the ninth](https://atcoder.jp/contests/abc351/tasks/abc351_a)[B - Spot the Difference ](https://atcoder.jp/contests/abc351/tasks/abc351_b)[D - Grid and Magnet](https://atcoder.jp/contests/abc351/tasks/abc351_d)E Note:…

Rust 实战练习 - 12. Axum Web 简单demo

Rust Web 历程 Rust 的异步框架tokio非他莫属,而web框架一直是悬而未决,说到底还是因为没有官方成熟的方案指引,大家各玩各的,互不兼容,白白浪费精力。 这个事情一直等到半官方组织tokio推出axum有了改善。但是市场上…

如何将本地Android studio项目上传到GitHub

操作步骤: 1、在GitHub上创建账户 2、在androd studio中添加上述创建的GitHub账号 3、在android studio上找到"share project on GitHub",点击此选项上传当前项目到GitHub 上传成功后,会在GitHub上创建默认仓库repository 注&a…