现象
在前端开发中，经常出现使用相对路径引入文件的情况，例如import api from "../../../api/test" import * as api from "../../../api" 。这种方式计算路径层级较为繁琐，会拖慢开发速度。
解决方法
对于Typescript项目
对于常用的目录，可以采用别名的方式进行引用优化。具体步骤如下：
- 在tsconfig.json文件中设置baseUrl为需要使用的目录路径，例如baseUrl: “./src”
- 在引用文件时，使用别名代替相对路径，例如import Demo1 from "page/Demo1" ，此时会从设置的baseUrl路径开始查找
- 注意：相对路径依然适用，不要将所有引用都替换为别名
对于Javascript项目
通过webpack配置设置别名，也可以优化引用路径。具体步骤如下：
- 覆盖原有webpack配置文件，例如config-overrides.js
- 在config-overrides.js中配置别名，例如addWebpackAlias({ '@': path.resolve('./src/components'), 'src': path.resolve('./src') })
- 在项目中使用别名引用文件，例如import Demo1 from 'components/Demo1' import Demo2 from 'src/components/Demo2'
- 注意：别名冲突时，需要在cssloader中进行配置或者使用~引入；不同版本的js和node插件可能会导致配置别名方法不同
结尾
引用别名可以方便地优化引用路径，提升开发效率。在具体使用时，需要注意相对路径和不同项目版本问题。
原创文章，作者：小编小本本，如若转载，请注明出处：https://www.benjiyun.com/yunzhujiyunwei/vps-yunwei/7408.html
相关推荐
-
cdh调优
你好，我是本际云服务器推荐网的小编小本本。今天我们来谈一下CDH(Cloudera Distribution Including Apache Hadoop)的调优方法。 调整资源…
-
VPS和云服务器有哪些区别？
VPS和云服务器的区别 作为虚拟化技术的产物，VPS和云服务器之间有几个显著的不同： VPS和云服务器的不同点 1. 架构 VPS是建立在以物理服务器为基础的虚拟化技术上的，而云服…
-
Caffe神经网络服务层及主要参数
介绍Caffe神经网络服务层及主要参数实例详细说明 本文主要介绍了Caffe神经网络服务层及主要参数实例详细说明。要运行Caffe，必须先构建一个实体模型（model），每个实体模…
-
基于AMP平台实现MySQL数据库快速部署
基于AMP平台实现MySQL数据库快速部署 尊敬的读者们，我是本际云服务器推荐网的小编小本本。在日常工作中，我们不可避免地会遇到客户业务端的MySQL安装需求。当业务规模越来越大，…
-
Django定时任务Django-crontab的使用方法介绍
Python中的定时任务 作为测试工程师，我们在测试平台中经常需要使用定时任务。在Python中使用Django可以轻松实现定时执行任务，检查订单等功能。下面就为大家介绍如何使用d…
-
使用JS实现点击button按钮切换图片具体代码
JS实现图片切换 尝试使用JS实现点击按钮切换图片，可以通过添加或删除display属性来隐藏或显示图片，同时设置button属性来改变按钮的样式，实现图片切换的效果。 实现代码 …
-
help函数处理python全部文本文档信息内容查看
前言 作为本际云服务器推荐网的小编小本本，今天给大家介绍一下如何使用python中的help函数来查看全部文本文档信息内容。 在python中，我们可以使用互动式cmd，在其中使用…
-
宝兰德bes中间件打补丁操作
介绍 您好，我是本际云服务器推荐网的小编小本本。今天我为大家介绍一下bes中间件打补丁操作。相比于weblogic中间件，bes中间件的打补丁速度更快，但补丁规则也更加繁琐。 补丁…
-
ddos攻击怎么防护？
DDoS攻击的种类 DDoS攻击是目前互联网安全领域中，最常见的攻击方式之一。其种类繁多，可分为4类：网络层攻击、传输层攻击、会话层攻击和应用层攻击，其中每一类攻击都有其特定的攻击…
-
React官方团队实例原生Hook闭包陷阱
深入理解React Hooks中的闭包陷阱 作为本际云服务器推荐网的小编小本本，我们不得不说，Hooks是React16.8版本引入的一项新特性，使得函数式组件可以拥有类组件同样的…