前端 JS 经典:node 的模块查找策略

简介: 前端 JS 经典:node 的模块查找策略

前言:我们引入模块后,node 大概的查找步骤分为 文件查找、文件夹查找、内置模块查找第三方模块查找,在 node 中使用 ESM 模块语法,需要创建 package.json 文件,并将 type 设置为 module。简单起见,我们用 CommonJs 模块语法,查找策略一样。

1. 文件/文件夹 查找

什么时候触发文件查找勒,node 会分析你的引用路径,发现我们引入模块使用绝对路径或者相对路径时。它会进入文件查找逻辑,根据路径去查找文件,如果没有 a 文件,会自动查找后缀名是 js 或 json 的同名文件

如果文件查找没找到,就会进入文件夹的模式,找到同名文件夹,如果文件夹里有 package.json 文件,根据文件中的 main 指向找到对应文件,如果没有 main 或者 main 字段没找到相应文件,就会找文件夹下的 index.js 文件。

import a from "/a";
// or
import a from "./a";
// or
import a from "../a";

2. 内置模块/第三方模块 查找

什么时候触发内置模块的查找呢,就是引入的路径直接以字符开头,node 就会进入内置模块和第三方模块查找,如果是内置模块,会直接拿到结果。

如果不是内置模块,会进入第三方模块查找。找到当前目录下的 node_modules 目录,在这个目录下找模块,如果在这个目录下没找到,又会进入文件/文件夹查找逻辑。如果当前目录没有 node_modules 它会往上级目录去找,直到找到这个系统的根目录。还找不到的话,就真找不到了。

// 内置模块
import fs from "fs";
 
// 第三方模块
import vue from "vue";
目录
相关文章
|
6天前
|
JavaScript 前端开发 API
详解队列在前端的应用,深剖JS中的事件循环Eventloop,再了解微任务和宏任务
该文章详细讲解了队列数据结构在前端开发中的应用,并深入探讨了JavaScript的事件循环机制,区分了宏任务和微任务的执行顺序及其对前端性能的影响。
|
4天前
|
JavaScript 前端开发 小程序
一小时入门Vue.js前端开发
本文是作者关于Vue.js前端开发的快速入门教程,包括结果展示、参考链接、注意事项以及常见问题的解决方法。文章提供了Vue.js的基础使用介绍,如何安装和使用cnpm,以及如何解决命令行中遇到的一些常见问题。
一小时入门Vue.js前端开发
|
7天前
|
存储 前端开发 JavaScript
前端基础(二)_JavaScript变量、JavaScript标识符、JavaScript获取元素、JavaScript的鼠标事件
本文介绍了JavaScript变量的声明和使用、标识符的命名规则、如何获取和操作HTML元素,以及JavaScript的鼠标事件处理,通过示例代码展示了这些基础知识点在实际开发中的应用。
22 2
前端基础(二)_JavaScript变量、JavaScript标识符、JavaScript获取元素、JavaScript的鼠标事件
|
7天前
|
前端开发 JavaScript API
React、Vue.js 和 Angular前端三大框架对比与选择
前端框架是用于构建用户界面的工具和库,它提供组件化结构、数据绑定、路由管理和状态管理等功能,帮助开发者高效地创建和维护 web 应用的前端部分。常见的前端框架如 React、Vue.js 和 Angular,能够提高开发效率并促进团队协作。
24 4
|
7天前
|
存储 前端开发 JavaScript
前端基础(三)_JavaScript数据类型(基本数据类型、复杂数据类型)
本文详细介绍了JavaScript中的数据类型,包括基本数据类型(Number、String、Boolean、Undefined、Null)和复杂数据类型(Object),并解释了如何使用`typeof`操作符来识别变量的数据类型。同时,还讨论了对象、函数和数组等复杂数据类型的使用方式。
13 2
|
6天前
|
存储 前端开发 JavaScript
浅谈Web前端安全策略xss和csrf,及又该如何预防?
该文章详细讨论了Web前端安全中的XSS(跨站脚本攻击)和CSRF(跨站请求伪造)攻击原理及其防范措施,帮助读者了解如何保护Web应用程序免受这两种常见安全威胁的影响。
浅谈Web前端安全策略xss和csrf,及又该如何预防?
|
3天前
|
缓存 前端开发 JavaScript
优化前端性能:关键策略与实践
在现代web开发中,前端性能优化至关重要。本文探讨了提升用户体验、转化率及降低服务器负载的关键策略,包括压缩资源文件、利用浏览器缓存、减少HTTP请求、异步加载、使用CDN、优化CSS/JavaScript执行、优化第三方脚本等,并介绍了Webpack/Rollup模块打包、HTTP/2特性、性能预算及Lighthouse/WebPageTest测试工具的应用。通过这些方法,可显著提高网站性能。
|
6天前
|
JavaScript 前端开发 开发者
深入浅出 Vue.js:构建响应式前端应用
Vue.js 是一个流行的前端框架,以其简洁、高效和易学著称。它采用响应式和组件化设计,简化了交互式用户界面的构建。本文详细介绍 Vue.js 的核心概念、基本用法及如何构建响应式前端应用,包括实例、模板、响应式数据和组件等关键要素,并介绍了项目结构、Vue CLI、路由管理和状态管理等内容,帮助开发者高效地开发现代化前端应用。
|
6天前
|
JavaScript 前端开发
网页前端课程设计-【模仿】香港中文大学官网,轮播图及div+css布局,js的dom操作
这篇文章介绍了如何模仿香港中文大学官网进行网页前端课程设计,包括使用div+css布局、js的DOM操作以及实现轮播图等技术细节。
|
7天前
|
前端开发 JavaScript
前端JS控制网页复制粘贴
前端JS控制网页复制粘贴
下一篇
无影云桌面