专业编程教程与实战项目分享平台

网站首页 > 技术文章 正文

前端脚手架的实现原理

ins518 2024-09-24 18:13:41 技术文章 12 ℃ 0 评论

node的目录结构

  1. bin可执行文件目录,可能是一些软链接
  2. lib全局安装的包存放的路径

为什么全局安装@vue/cli后会添加vue命令

node下的bin目录是一些可执行文件,其中vue指令是一个软链接指向了实际的@vue/cli目录,在该目录下的package.json中有一个bin属性决定了实际命令的名称,同时指定了执行时的入口文件。

全局安装@vue/cli的时候发生了什么

  1. npm install -g的时候node会将包安装到其/lib/node_modules目录下
  2. 安装完后会检查包的package.json,如果其有bin属性,就会在node的安装主目录下(/.nvm/versions/node/v16.15.1 )的bin目录创建一个软链接指向实际安装目录

执行一个vue命令的时候发生了什么,为什么vue指向的是一个js文件,却可以直接通过vue命令执行它

在执行vue命令时,操作系统会先通过which vue的路径找到vue并执行这个文件,该文件以#!/usr/bin/env node 开头声明其使用node环境执行。

我们可以尝试如下操作验证上面的内容,先使用which node查看node的安装目录,可以看到上述对应的目录结构,安装对应的node包后,查看bin和lib目录可以看到对应的包和可执行命令已经被添加,查看包的package.json,发现对应的bin属性中有vue属性,并且指向实际执行文件,打开该文件,可以看到文件首行声明的执行环境为node。

另外我们也可以尝试自己创建一个js文件,文件首行声明执行环境,然后为该文件添加可执行权限,并给该文件创建软链接,也就是在bin目录创建对应命令。完成这些步骤,我们就可以使用对应的命令执行操作。

Linux常见操作

  1. chmod 777 filename:添加可执行权限
  2. echo $PATH:查看环境变量
  3. ln -s 路径 名称:创建软链接,软链接可以嵌套,相当于起别名
  4. #!/usr/bin/env node 声明使用node环境执行

本文暂时没有评论,来添加一个吧(●'◡'●)

欢迎 发表评论:

最近发表
标签列表