当前位置:主页 > 聚焦 >

react设置文件路径别名的具体方法你知道么

时间:2020-12-14 03:40:05

  文章环境:

  “react”: “^16.13.1” 版本

  学习视频分享:react视频教程

  react官方脚手架默认是将webpack配置隐藏起来了,在进行配置之前需要将webpack给暴露出来。

  1、输入命令 npm run eject

  会出现一个命令提示:这是一个单向操作,确认操作后不可逆转/返回?

  输入 y 回车

  成功之后 在项目根目录出现 config 文件夹

  2、打开 config 文件夹下的fig.js 文件

  3、进行搜索 alias ,大概在 291 行的位置

  参照如下格式,设置路径别名

   alias: { // Support react Native Web // 文件路径别名 '@': path.resolve(__dirname, '../src'), '@view': path.resolve(__dirname, '../src/view'), },

  需要特别注意的是: webpack配置进行改动后,都需要重新启动项目,不然不生效

  5、在项目中使用

  打开 index.js ,将 import ./index.css 替换成 import '@/index.css’

  注: @ 在上面已经被设置 src文件路径

  6、启动项目, 无报错,并且样式生效

热点推荐
1 USDT在印度交易溢价达7%至10%

消息,USDT在印度加密平台的交易价格远高于面值,溢价达7%至10%。当地交易所表示,这一现象...

2 两名巨鲸以高杠杆做空BTC,空单总规模超

消息,据Lookonchain监测,两名巨鲸正在做空BTC,空单总规模超过1亿美元。其中一名巨鲸以40倍杠...

3 马来亚银行:日本拥有充足的日元干预“

消息,马来亚银行分析师指出,日元兑美元汇率突破162关口引发了干预风险,因为该水平被视...

4 Ignas:欧洲用户失去对全球中心化交易所

消息,DeFi分析师Ignas表示,欧洲用户正在失去对全球版中心化交易所的访问权限。他指出,O...

5 币安将于2026年7月1日进行比特币网络钱包

消息,币安宣布将于2026年7月1日01:00对比特币网络进行钱包维护。在维护期间,比特币网络的存...

6 鲸鱼地址0xa6e以25倍杠杆开设22000枚ETH空单

消息,鲸鱼地址0xa6e最近以25倍杠杆开设了一笔新的22,000枚ETH空单,名义价值约为3500万美元。...

7 Pump.fun累计回购超4亿美元PUMP代币,平台总

消息,Pump.fun平台已累计回购超过4亿美元的PUMP代币,涉及约1455亿枚PUMP。回购计划自2025年7月启...

8 欧盟已发放244张MiCA牌照,德国与法国占比

消息,欧盟截至6月29日已发放244张MiCA牌照,其中德国以57张居首,法国以26张位列第二。希腊、...

9 Defillama:加密行业累计损失约166.9亿美元

消息,加密行业累计约166.9亿美元因黑客攻击、DeFi漏洞及跨链桥攻击而损失,其中约40%与私钥...

10 Kraken即将上线Bittensor子网Alpha代币

消息,DCG创始人兼首席执行官Barry Silbert在X平台披露,Kraken即将上线Bittensor子网Alpha代币,首批...

成都来彰科技 蜀ICP备2025134723号-1

资讯来源互联网,如有版权问题请联系管理员删除。