网站开发流程莆田网页设计主要做什么

😁 作者简介：一名大四的学生，致力学习前端开发技术
⭐️个人主页：夜宵饽饽的主页
❔ 系列专栏：NodeJs
👐学习格言：成功不是终点，失败也并非末日，最重要的是继续前进的勇气

​🔥​前言：

本文是关于Node命令中的npm link命令的详细使用，还有脚手架的背后原理，如果我们需要开发命令行工具或者脚手架时，npm link的使用是必不可少的一环，有关环境变量部分大家一定要好好理解，希望可以帮助到大家，欢迎大家的补充和纠正

Node命令

1.CLI全局命令

当我们安装一个npm包之后，我们可以再电脑的任意终端使用这个npm包提供的指令，例如：当我们安装了nest npm install -g @nestjs/cli ，我们就可以在任意地方使用nest这个指令，例如：

nest new my-nest-project ，就会帮我们创建一个名字叫 my-nest-project的nest项目，这是怎么做到的呢？

1.1 环境变量

我们做格知识准备，先了解一下什么是环境变量。

环境变量就是Window一个命令执行路径：

echo %PATH%C:\Program Files\Java\jdk1.8.0_261\bin;C:\Program Files\Git\bin;C:\Windows\System32;...

上面打印出来的就是环境变量，其中有我们熟悉的java文件执行，Git指令等，当我们在终端执行某一个指令时，其会在这些路径下面寻找是否有对应的可执行文件。有就会执行，没有就报错（错误信息：不是内部或外部命令，也不是可运行的程序或批处理文件）

1.2 npm安装全局指令流程

我们在执行npm install -g @nestjs/cli之后，就可以启动nest全局命令，这是因为在环境变量的路径下创建创建了一个nest文件

//可以使用下面这个命令查询Node全局安装指令的位置。
//注意输出的位置，这个位置很重要，下文会经常用到
npm bin -g
// C:\Users\AppData\Roaming\npm

在这个输出的路劲下，可以看到nest文件

这个文件会中有指向具体执行的npm包的位置：/node_modules/@nestjs/cli/bin/nest.js

所以总的执行流程可以感觉到：

输入一个nest指令 -> 在环境变量中寻找 ->找到nest可执行文件 ->执行/node_modules/@nestjs/cli/bin/nest.js 文件

3.package.json里的bin字段

我们来看nestjs包中的package.json，可以发现一个重点：

我们可以注意到与上面指令真正执行的文件是一致的，所以最终执行的是bin/nest.js

2.npm link

上面说的是全局安装包的模式，那如果是还在本地开发的包呢，我们不能每改一点东西就发到线上，然后安装下来再验证吧，这时候就需要使用npm link了

我们使用npm link主要分为两种功能：

• 一个是这个npm包需要被其他的包引用
• 一个是这个npm包作为命令行工具直接再终端用指令执行

2.1作为npm包被其他包引用

场景：假设我们有两个包，分别是a和b，b是我们本地在开发的调试包，a是我们的项目，a需要引用到b

这个场景我们分为两步来实现：

• 在b中使用npm link
• 在a中使用这个b包

在开发调试的包中执行npm link

我们在b的目录下执行npm link，这个时候会发现在C:\Users\AppData\Roaming\npm\node_modules目录下会生成一个链接文件，名字就是package.json中的name

在项目中执行npm link

当我们在b中执行npm link之后，已经在全局npm包中生成了一个目录，所以我们可以在开发项目的a包中安装b，只要在a包中执行npm link b

这时候我们就在a项目中使用require('b')的时候，会通过项目下的node_module找到b，而这个b文件可以注意到后面的一个箭头，表示这个b文件会引用到实际的b中，有点像网页中的链接一样的感觉

我们现在可以来理一下流程：
😄 总结：当我们在a中执行npm link b命令的时候，系统会去 C:\Users\AppData\Roaming\npm\node_modules 这个目录下寻找有没有b文件(或者链接文件），那么刚好我们在b目录下执行的npm link时会在上面的路径中生成b的链接文件，所以这个命令执行的关系时：a/node_module/b -> C:\Users\AppData\Roaming\npm\node_modules/b -> 真正的b文件

2.2 作为命令行工具需要直接在终端调用

这种功能的实现，一般来说都是命令行工具，脚手架之类的，可以直接在终端输入指令来执行项目主文件，就像nest.js一样，在终端输入nest就会执行nest脚手架项目中的主文件来生成项目框架

我们在a文件中输入node link 会在C:\Users\AppData\Roaming\npm\node_modules 路径下生成a文件的链接，而且还会在外一层的目录生成指令文件 例如：

上面中可以看到，执行npm link命令之后，在package.json中的bin对象下的"a-cmd": "./index.js" 键值被使用，之后我们可以在命令行使用a-cmd命令,而这个命令会去执行index.js文件。

我们接下来看 C:\Users\AppData\Roaming\npm中是什么样子：

从上图可以看到终端中有了像nest指令一样的a-cmd指令，当在终端输入该执行后，会执行index.js文件

成功输出语句

最后

🌼建议： 本文的要结合实操性去理解，希望大家自己手动操作一遍哪些npm link知识点，相信你会收获更多的

😁 笔者会继续更新前端的知识，目前已有两个大专栏，如果感兴趣，不妨关注一下吧！谢谢 ！ 🌱

• JavaScript小贴士：有关javaScritp中的小的知识点，有点像知识碎片
• JavaScript进阶指南 ：里面是javaScritp中的一个大知识点，例如：原型，this指向,模块，各种类型知识扩展等。