惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

奇客Solidot–传递最新科技情报
奇客Solidot–传递最新科技情报
大猫的无限游戏
大猫的无限游戏
博客园 - 聂微东
Jina AI
Jina AI
The Cloudflare Blog
V
Visual Studio Blog
博客园_首页
量子位
酷 壳 – CoolShell
酷 壳 – CoolShell
博客园 - 【当耐特】
爱范儿
爱范儿
博客园 - 三生石上(FineUI控件)
小众软件
小众软件
博客园 - 司徒正美
阮一峰的网络日志
阮一峰的网络日志
Last Week in AI
Last Week in AI
V
V2EX
钛媒体:引领未来商业与生活新知
钛媒体:引领未来商业与生活新知
博客园 - 叶小钗
freeCodeCamp Programming Tutorials: Python, JavaScript, Git & More
WordPress大学
WordPress大学
宝玉的分享
宝玉的分享
T
Tailwind CSS Blog
博客园 - Franky

小小孩

vaultwarden 部署 - 小小孩 去除宝塔面板一些无用的页面信息 - 小小孩 如何在 Bing 和 百度搜索中去除 CSDN 搜索结果 Nginx 安装 brotli 模块 - 小小孩 JavaScript 高性能现代网页截图 - 小小孩 JS 深拷贝终结者 structuredClone - 小小孩 http 协议头 Content-Disposition 的作用 - 小小孩 Echarts示例 Demo 合集网站 - 小小孩 LNMP Nginx 安装 brotli 模块
前端项目路径别名终极解决方案 - 小小孩
小小孩 · 2001-11-11 · via 小小孩

原生路径解决

Node.js v12.19.0 开始,开发人员可以使用 Subpath Imports 在 npm 包中声明路径别名。这可以通过 package.json 文件中的 imports 字段来完成。不需要在 npm 上发布包。在任何目录中创建一个 package.json 文件就足够了。因此,这种方法也适用于私人项目。

配置路径别名,假如有项目结构如下:

my-project  
├── src/  
│ ├── components/  
│ │ └── searchForm/  
│ │ └── form/  
│ │ └── index.ts  
│ ├── pages/  
│ │ └── login/  
│ │ └── about/  
│ │ └── home/ 
│ └── mock/  
│ └── api/  
│ └── index.ts  
└── package.json

我们可以在 package.json 中这么配置:

{
 "name": "my-awesome-project",
 "imports": {
  "#*": "./*"
 }
}

接下来就是愉快的使用了:

import { SearchForm } from "#src/components/searchForm";