脚手架执行原理

什么是脚手架

脚手架严格意义上是一个运行在操作系统上的客户端,依赖node.js运行时环境

为什么要有脚手架

脚手架主要的意义是进行开发提效
拿前端举例 项目创建 测试 回滚 发布等一系列流程都可以通过脚手架完成大大提升了开发效率

  • 脚手架可以做项目初始化
  • 用脚手架维护通用组件库
  • 用脚手架实现自动构建 打包 发布 CDN静态资源映射等一系列流程
  • 等等脚手架是研发中台必不可少的一环

脚手架的执行原理

此处用@vue/cli举例

vue create demo -f -r "http://xxxx"

脚手架是运行在操作系统上的客户端,或者说node.js是运行在操作系统上的客户端 vue.js是它的参数

vue是主命令 create是子命令 demo是options 这就是一条完整脚手架命令的构成

首先主命令vue 是由操作系统解析,
操作系统会通过环境变量找到[vue]这个可执行文件

  • mac系统这条命令对应一个在bin目录下的软连接,这条软连接指向lib目录下的vue.js文件
  • windows系统这条命令对应npm文件下的vue.cmd文件

查看脚手架运行目录的命令
mac:which vue
windows:where vue

windows下找到vue.cmd操作系统会直接运行,使用node启动其指向的vue.js文件,执行node vue.js [command][options],vue.js会解析command和options完成后续过程

等价于

node .\node_modules\@vue\cli\bin\vue.js create demo -f

mac系统下找到vue软连接,直接执行vue.js文件,vue.js文件不是可执行文件,所以需要在js文件中声明

#!/usr/bin/env node

/usr/bin/env 可以打印所有环境变量,意思为环境变量中查找node,并且用node运行vue.js文件

  • 这是一条完整脚手架命令的执行过程
vue.cmd 或 vue 软连接是在哪里定义的怎么生成的?

在脚手架开发时可以在package.json中定义

"bin":{
    "vue":"bin/vue.js"
}
  • 也可以通过手动更改 .cmd文件或软连接嵌套更改
  • npm安装包后会解析package.json 文件如果发现存在bin字段那么会自动生成其对应的软连接

posted on 2022-05-09 09:35  素心~  阅读(182)  评论(0编辑  收藏  举报

导航