【开发脚手架】系列教程 -1- 脚手架的价值,功能,命令详解,执行原理图解

简介: 【开发脚手架】系列教程 -1- 脚手架的价值,功能,命令详解,执行原理图解

脚手架简介

脚手架本质是一个操作系统的客户端,通过命令行执行。

vue2的脚手架Vue cli为例,通过执行以下命令来创建vue项目

vue create vue-test-app

脚手架的核心价值

提升前端研发效能

脚手架的功能

将研发过程

  • 自动化:项目重复代码拷贝/git操作/发布上线操作
  • 标准化:项目创建/git flow/发布流程/回滚流程
  • 数据化:研发过程系统化、数据化,使得研发过程可量化

脚手架的命令【详解】

通过下方范例命令,来看看命令的格式

vue create vue-test-app --force -r https://registry.npm.taobao.org
  • vue 是主命令,通常是脚手架的名称或方便记忆的别名(脚手架Vue cli在安装时使用的@vue/cli,命令中使用的别名 vue)
  • create 是脚手架内部名义的命令,通常表示脚手架执行某项操作,这里是创建
  • vue-test-app 是命令的参数,此处为自定义的新创建的vue项目的项目名称。
  • –force 是命令的配置(–前缀的都是命令的配置),命令的配置也有参数,此处进行了简写,完整写法是 --force true,此配置表示如果当前目录已经有文件,则覆盖当前目录下的文件,强制创建 vue 项目,
  • -r 是–registry的简写(-前缀的都是命令配置的简写),此配置表示注册
  • https://registry.npm.taobao.org 是 -r 配置的参数,此处表示将下载源改为淘宝源

查看脚手架命令相关配置的方法是用 --help,如

vue create --help

脚手架的执行原理

  • 在终端输入 vue create vue-test-app
  • 终端解析出 vue 命令
  • 终端在环境变量中找到 vue 命令
  • 终端根据 vue 命令链接到实际文件 vue.js
  • 终端利用 node 执行 vue.js
  • vue.js 解析 command / options
  • vue.js 执行 command
  • 执行完毕,退出执行

自研脚手架和自动化构建工具的区别

  • jenkins、travis等自动化构建工具通常在git hooks中触发,需要在服务端执行,无法覆盖研发人员本地的功能,如:创建项目自动化、本地git操作自动化等。
  • jenkins、travis等自动化构建工具定制过程需要开发插件,过程较为复杂,需要使用Java语言,对前端不够友好
目录
相关文章
|
2月前
|
JavaScript Java 测试技术
基于SpringBoot+Vue+uniapp的网络办公系统的详细设计和实现(源码+lw+部署文档+讲解等)
基于SpringBoot+Vue+uniapp的网络办公系统的详细设计和实现(源码+lw+部署文档+讲解等)
|
16天前
|
JavaScript Java 测试技术
基于SpringBoot+Vue+uniapp的便捷饭店点餐小程序的详细设计和实现(源码+lw+部署文档+讲解等)
基于SpringBoot+Vue+uniapp的便捷饭店点餐小程序的详细设计和实现(源码+lw+部署文档+讲解等)
|
2天前
|
开发工具 数据安全/隐私保护 git
Lerna 使用教程 -- 开发脚手架的流程和核心命令详解
Lerna 使用教程 -- 开发脚手架的流程和核心命令详解
7 0
|
1月前
|
JavaScript Java 测试技术
基于SpringBoot+Vue+uniapp的远程在线诊疗系统的详细设计和实现(源码+lw+部署文档+讲解等)
基于SpringBoot+Vue+uniapp的远程在线诊疗系统的详细设计和实现(源码+lw+部署文档+讲解等)
|
2月前
|
JavaScript Java 测试技术
基于SpringBoot+Vue+uniapp的少儿编程在线培训系统的详细设计和实现(源码+lw+部署文档+讲解等)
基于SpringBoot+Vue+uniapp的少儿编程在线培训系统的详细设计和实现(源码+lw+部署文档+讲解等)
|
2月前
|
JavaScript Java 测试技术
基于SpringBoot+Vue+uniapp的在线作业管理系统的详细设计和实现(源码+lw+部署文档+讲解等)
基于SpringBoot+Vue+uniapp的在线作业管理系统的详细设计和实现(源码+lw+部署文档+讲解等)
|
1月前
|
测试技术 数据安全/隐私保护 Java
基于SpringBoot+Vue+uniapp的穿戴搭配系统的详细设计和实现(源码+lw+部署文档+讲解等)
基于SpringBoot+Vue+uniapp的穿戴搭配系统的详细设计和实现(源码+lw+部署文档+讲解等)
|
1月前
|
测试技术 数据安全/隐私保护 Java
基于SpringBoot+Vue+uniapp的线上书籍查阅系统的详细设计和实现(源码+lw+部署文档+讲解等)
基于SpringBoot+Vue+uniapp的线上书籍查阅系统的详细设计和实现(源码+lw+部署文档+讲解等)
|
2月前
|
JavaScript Java 测试技术
基于SpringBoot+Vue+uniapp的在线测试管理系统的详细设计和实现(源码+lw+部署文档+讲解等)
基于SpringBoot+Vue+uniapp的在线测试管理系统的详细设计和实现(源码+lw+部署文档+讲解等)
277 0
|
2月前
|
JavaScript Java 测试技术
基于SpringBoot+Vue+uniapp的云端学习系统的详细设计和实现(源码+lw+部署文档+讲解等)
基于SpringBoot+Vue+uniapp的云端学习系统的详细设计和实现(源码+lw+部署文档+讲解等)

热门文章

最新文章

  • 1
    流量控制系统,用正则表达式提取汉字
    25
  • 2
    Redis09-----List类型,有序,元素可以重复,插入和删除快,查询速度一般,一般保存一些有顺序的数据,如朋友圈点赞列表,评论列表等,LPUSH user 1 2 3可以一个一个推
    26
  • 3
    Redis08命令-Hash类型,也叫散列,其中value是一个无序字典,类似于java的HashMap结构,Hash结构可以将对象中的每个字段独立存储,可以针对每字段做CRUD
    26
  • 4
    Redis07命令-String类型字符串,不管是哪种格式,底层都是字节数组形式存储的,最大空间不超过512m,SET添加,MSET批量添加,INCRBY age 2可以,MSET,INCRSETEX
    27
  • 5
    S外部函数可以访问函数内部的变量的闭包-闭包最简单的用不了,闭包是内层函数+外层函数的变量,简称为函数套函数,外部函数可以访问函数内部的变量,存在函数套函数
    24
  • 6
    Redis06-Redis常用的命令,模糊的搜索查询往往会对服务器产生很大的压力,MSET k1 v1 k2 v2 k3 v3 添加,DEL是删除的意思,EXISTS age 可以用来查询是否有存在1
    30
  • 7
    Redis05数据结构介绍,数据结构介绍,官方网站中看到
    22
  • 8
    JS字符串数据类型转换,字符串如何转成变量,+号只要有一个是字符串,就会把另外一个转成字符串,- * / 都会把数据转成数字类型,数字型控制台是蓝色,字符型控制台是黑色,
    20
  • 9
    JS数组操作---删除,arr.pop()方法从数组中删除最后一个元素,并返回该元素的值,arr.shift() 删除第一个值,arr.splice()方法,删除指定元素,arr.splice,从第一
    20
  • 10
    定义好变量,${age}模版字符串,对象可以放null,检验数据类型console.log(typeof str)
    19