react如何快速设置文件路径别名


Posted in Javascript onApril 28, 2021

React是用于构建用户界面的JavaScript库,  起源于Facebook的内部项目,因为该公司对市场上所有 JavaScript MVC框架,都不满意,就决定自己写一套,用来架设Instagram的网站。做出来以后,发现这套东西很好用,就在2013年5月开源了。

React 是一个用于构建用户界面的 JAVASCRIPT 库。

React 主要用于构建UI,很多人认为 React 是 MVC 中的 V(视图)。

React 起源于 Facebook 的内部项目,用来架设 Instagram 的网站,并于 2013 年 5 月开源。

React 拥有较高的性能,代码逻辑非常简单,越来越多的人已开始关注和使用它。

由于webpack隐藏了配置文件需要先暴露出来,进入项目目录后在cmd中运行以下代码

npm run eject

react如何快速设置文件路径别名

你确定要退出吗?这种行为是永久的。
输入y 然后回车
运行结束后在项目文件夹中找到config文件夹

react如何快速设置文件路径别名

打开webpack.config.js

react如何快速设置文件路径别名

按下 Ctrl+f 查找 alias 找到配置项

react如何快速设置文件路径别名

配置一下映射,可以参照以下我的配置

alias: {
        "react-native": "react-native-web",
        ...(isEnvProductionProfile && {
          "react-dom$": "react-dom/profiling",
          "scheduler/tracing": "scheduler/tracing-profiling",
        }),
        ...(modules.webpackAliases || {}),
        // 配置文件别名,左边是别名右边是对应的路径
        "@": path.resolve(__dirname, "../src"),
        "@scss": path.resolve(__dirname, "../src/assets/scss"),
        "@images": path.resolve(__dirname, "../src/assets/images"),
        "@views": path.resolve(__dirname, "../src/views"),
        "@components": path.resolve(__dirname, "../src/components"),
      },

配置完成后重新启动一下项目就行了

到此这篇关于react如何快速设置文件路径别名的文章就介绍到这了,更多相关react文件路径别名内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
ExtJS4 Grid改变单元格背景颜色及Column render学习
Feb 06 Javascript
Internet Explorer 11 浏览器介绍:别叫我IE
Sep 28 Javascript
js获取微信版本号的方法
May 12 Javascript
基于JavaScript如何实现私有成员的语法特征及私有成员的实现方式
Oct 28 Javascript
如何消除inline-block属性带来的标签间间隙
Mar 31 Javascript
AngularJS基础 ng-include 指令简单示例
Aug 01 Javascript
angular-ui-sortable实现可拖拽排序列表
Dec 28 Javascript
JS正则匹配中文的方法示例
Jan 06 Javascript
Javascript中的 “&” 和 “|” 详解
Feb 02 Javascript
MUI 上拉刷新/下拉加载功能实例代码
Apr 13 Javascript
vue实现重置表单信息为空的方法
Sep 29 Javascript
浅谈vue3中effect与computed的亲密关系
Oct 10 Javascript
原生JS封装vue Tab切换效果
vue项目两种方式实现竖向表格的思路分析
测量JavaScript函数的性能各种方式对比
Apr 27 #Javascript
比较node.js和Deno
Apr 27 #Javascript
如何用JavaScript检测当前浏览器是无头浏览器
Apr 27 #Javascript
如何利用js在两个html窗口间通信
Apr 27 #Javascript
如何使JavaScript休眠或等待
Apr 27 #Javascript
You might like
几种有用的变型 PHP中循环语句的用法介绍
2012/01/30 PHP
PHP图片上传代码
2013/11/04 PHP
php实现解析xml并生成sql语句的方法
2018/02/03 PHP
eval的两组性能测试数据
2012/08/17 Javascript
jquery的clone方法应用于textarea和select的bug修复
2014/06/26 Javascript
通过JS来动态的修改url,实现对url的增删查改
2014/09/01 Javascript
JavaScript中的this关键字使用详解
2015/08/14 Javascript
js实现的Easy Tabs选项卡用法实例
2015/09/06 Javascript
JavaScript函数学习总结以及相关的编程习惯指南
2015/11/16 Javascript
利用jQuery及AJAX技术定时更新GridView的某一列数据
2015/12/04 Javascript
深入理解JavaScript内置函数
2016/06/03 Javascript
ionic由于使用了header和subheader导致被遮挡的问题的两种解决方法
2016/09/22 Javascript
JS原型与原型链的深入理解
2017/02/15 Javascript
Vue中引入样式文件的方法
2017/08/18 Javascript
详解Webpack+Babel+React开发环境的搭建的方法步骤
2018/01/09 Javascript
微信小程序实现简单购物车功能
2020/12/30 Javascript
Python实现的异步代理爬虫及代理池
2017/03/17 Python
使用Python对微信好友进行数据分析
2018/06/27 Python
python 调用钉钉机器人的方法
2019/02/20 Python
python查询文件夹下excel的sheet名代码实例
2019/04/02 Python
python UDP(udp)协议发送和接收的实例
2019/07/22 Python
Python计算信息熵实例
2020/06/18 Python
Django --Xadmin 判断登录者身份实例
2020/07/03 Python
pandas 按日期范围筛选数据的实现
2021/02/20 Python
html5设计原理(推荐收藏)
2014/05/17 HTML / CSS
网络方面基础面试题
2012/11/16 面试题
某同学的自我鉴定范文
2013/12/26 职场文书
服装设计专业自荐书范文
2013/12/30 职场文书
学生宿舍管理制度
2014/01/30 职场文书
文字自荐书范文
2014/02/10 职场文书
2015年幼儿园毕业感言
2014/02/12 职场文书
机械加工与数控专业自荐书
2014/06/04 职场文书
爱护草坪标语
2014/06/24 职场文书
应届大专生求职信
2014/06/26 职场文书
处级干部考察材料
2014/12/24 职场文书
刑事上诉状范文
2015/05/22 职场文书