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 相关文章推荐
javascript实现unicode和字符的互相转换
Jul 18 Javascript
Javascript YUI 读码日记之 YAHOO.util.Dom - Part.2 0
Mar 22 Javascript
asp.net下使用jquery 的ajax+WebService+json 实现无刷新取后台值的实现代码
Sep 19 Javascript
让网页跳转到指定位置的jquery代码非书签
Sep 06 Javascript
给ListBox添加双击事件示例代码
Dec 02 Javascript
jQuery toggleClass应用实例(附效果图)
Apr 06 Javascript
js判断主流浏览器类型和版本号的简单实现代码
May 26 Javascript
jQuery ui autocomplete选择列表被Bootstrap模态窗遮挡的完美解决方法
Sep 23 Javascript
AngularJs上传前预览图片的实例代码
Jan 20 Javascript
AngularJS实现的鼠标拖动画矩形框示例【可兼容IE8】
May 17 Javascript
Vue Router的手写实现方法实现
Mar 02 Javascript
Vue文本模糊匹配功能如何实现
Jul 30 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
上海牌131型七灯四波段四喇叭一级收音机
2021/03/02 无线电
php不使用插件导出excel的简单方法
2014/03/04 PHP
php绘制圆形的方法
2015/01/24 PHP
PHP结合jQuery插件ajaxFileUpload实现异步上传文件实例
2020/08/17 PHP
Javascript笔记一 js以及json基础使用说明
2010/05/22 Javascript
jQuery 1.5.1 发布,全面支持IE9 修复大量bug
2011/02/26 Javascript
JS获取整个页面文档的实现代码
2011/12/15 Javascript
JavaScript将页面表格导出为Excel的具体实现
2013/12/27 Javascript
分步解析JavaScript实现tab选项卡自动切换功能
2016/01/25 Javascript
基于JQuery打造无缝滚动新闻步骤详解
2016/03/31 Javascript
深入浅析JavaScript中的constructor
2016/04/19 Javascript
jQuery日程管理控件glDatePicker用法详解
2017/03/29 jQuery
jquery实现放大镜简洁代码(推荐)
2017/06/08 jQuery
Form表单上传文件(type="file")的使用
2017/08/03 Javascript
解决echarts的多个折现数据出现坐标和值对不上的问题
2018/12/28 Javascript
用实例说明python的*args和**kwargs用法
2013/11/01 Python
python批量同步web服务器代码核心程序
2014/09/01 Python
Python文件及目录操作实例详解
2015/06/04 Python
python实现查找两个字符串中相同字符并输出的方法
2015/07/11 Python
Python中asyncore异步模块的用法及实现httpclient的实例
2016/06/28 Python
python获取外网IP并发邮件的实现方法
2017/10/01 Python
在Python中过滤Windows文件名中的非法字符方法
2019/06/10 Python
Python企业编码生成系统之系统主要函数设计详解
2019/07/26 Python
python图形开发GUI库pyqt5的详细使用方法及各控件的属性与方法
2020/02/14 Python
Spring @Enable模块驱动原理及使用实例
2020/06/23 Python
使用css3制作登录表单的步骤
2014/04/07 HTML / CSS
Giglio美国站:意大利奢侈品购物网
2018/02/10 全球购物
限量版运动鞋和街头服饰:TheDrop
2020/09/06 全球购物
开水果连锁店创业计划书
2013/12/29 职场文书
医药销售求职信范文
2014/02/01 职场文书
聘任书的写作格式及范文
2014/03/29 职场文书
教师中国梦演讲稿
2014/04/23 职场文书
酒店财务部岗位职责
2015/04/14 职场文书
CSS3 制作精美的定价表
2021/04/06 HTML / CSS
CSS极坐标的实例代码
2021/06/03 HTML / CSS
Mybatis是这样防止sql注入的
2021/12/06 Java/Android