chengpeiquan / learning-vue3

超过 230w+ 阅读人次的《Vue3 入门指南与实战案例》,关于前端工程化开发的基础知识点,以及 TypeScript 、 Vue 3 、 Pinia 的入门学习指南。

Home Page:https://vue3.chengpeiquan.com

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

创建npm包那一节过于晦涩,不好懂

nanfb opened this issue · comments

在看到进行本地调试的时候就有点懵了,很混乱。比如为什么会出现“path/to/xxx”这样的目录,本地测试的npm link作用机制是什么,等等

晚上好~ 这个 issue 让我了解到有时候一些计算机相关的典故,在第一次出现的时候可以做一个延伸阅读或解释,如果不介意的话,稍后我想把这个 issue 关联到这部分内容作为 FAQ 入口。


为什么会出现“path/to/xxx”这样的目录

path/to 是一个很典型的关于路径例子,通常用来做路径举例,不代表实际的某个路径。如果能访问到 StackOverflow 的话,这个问题下的答案解释很有趣,可以看一看 What is "/path/to"? (提问来自 13 年前,实际这个典故应该历史更久)。

文章里我写的是 “假设 path/to/my-library 是一个 npm 包的项目路径”,那么对应的就可以理解为自己的某个项目路径,没有针对哪个项目,只要是 npm 包的源代码所在的项目根目录即可( package.json 所在的那一层目录),假设在你的 Windows 电脑里的 D 盘下的这个目录 D:\demo\lib 是一个 npm 包,那么对应的就替换成:

# 进入 npm 包项目所在的目录
-cd path/to/my-library
+cd D:\demo\lib

macOS 和 Linux 的路径格式有所不同,具体以实际的操作系统支持的路径为准。

同理 “path/to/my-project 是一个调试项目的所在路径”,那么这个项目也可以任意其他项目,只要可以安装并使用那个 npm 包,那么这个项目就是一个有效的项目(也是对应 package.json 所在的那一层目录)。


本地测试的 npm link 作用机制是什么

这里在文章里也提及啦,在 path/to/my-library 这个 npm 包的目录下,通过执行 npm link 命令,创建 npm 包的本地软链接,可以这么简单理解:这个时候会把这个未发布的 npm 包当成一个 “模拟已发布” 的状态,全局安装到你的电脑里。

而在 path/to/my-project 这个项目里,执行 npm link {包名} 或者 npm link {路径} ,则可以把 “模拟已发布”的 npm 包,“安装”到这个项目里使用,达成一个本地调试的目的。

这些操作的背后都是通过软链接来实现,在文章里都有对应的说明,也可以查阅 npm 的文档了解更多信息

https://docs.npmjs.com/cli/v10/commands/npm-link

晚上好~ 这个 issue 让我了解到有时候一些计算机相关的典故,在第一次出现的时候可以做一个延伸阅读或解释,如果不介意的话,稍后我想把这个 issue 关联到这部分内容作为 FAQ 入口。

为什么会出现“path/to/xxx”这样的目录

path/to 是一个很典型的关于路径例子,通常用来做路径举例,不代表实际的某个路径。如果能访问到 StackOverflow 的话,这个问题下的答案解释很有趣,可以看一看 What is "/path/to"? (提问来自 13 年前,实际这个典故应该历史更久)。

文章里我写的是 “假设 path/to/my-library 是一个 npm 包的项目路径”,那么对应的就可以理解为自己的某个项目路径,没有针对哪个项目,只要是 npm 包的源代码所在的项目根目录即可( package.json 所在的那一层目录),假设在你的 Windows 电脑里的 D 盘下的这个目录 D:\demo\lib 是一个 npm 包,那么对应的就替换成:

# 进入 npm 包项目所在的目录
-cd path/to/my-library
+cd D:\demo\lib

macOS 和 Linux 的路径格式有所不同,具体以实际的操作系统支持的路径为准。

同理 “path/to/my-project 是一个调试项目的所在路径”,那么这个项目也可以任意其他项目,只要可以安装并使用那个 npm 包,那么这个项目就是一个有效的项目(也是对应 package.json 所在的那一层目录)。

本地测试的 npm link 作用机制是什么

这里在文章里也提及啦,在 path/to/my-library 这个 npm 包的目录下,通过执行 npm link 命令,创建 npm 包的本地软链接,可以这么简单理解:这个时候会把这个未发布的 npm 包当成一个 “模拟已发布” 的状态,全局安装到你的电脑里。

而在 path/to/my-project 这个项目里,执行 npm link {包名} 或者 npm link {路径} ,则可以把 “模拟已发布”的 npm 包,“安装”到这个项目里使用,达成一个本地调试的目的。

这些操作的背后都是通过软链接来实现,在文章里都有对应的说明,也可以查阅 npm 的文档了解更多信息

https://docs.npmjs.com/cli/v10/commands/npm-link

感谢您的回答,差不多可以理解了,这本书很不错,感谢您