大前端工程师成长路线

# 脚手架工具

组织结构、模块依赖、工具配置、开发范式、基础代码

# 介绍

# vue cli

Vue项目的集成式构件化方案

# creat react app

# Yeoman

通用型项目脚手架

# 搭建步骤

  1. 安装yo
npm install yo --global # or yarn global add yo
  1. 选择模版下载
npm install generator-node --global # or yarn global add generator-node
  1. yo运行generator
yo node
  1. 部分功能(sub generator)的使用(以generator-node为例 (opens new window))
yo node:cli

# 总结

使用Yeoman的核心在于 1.明确需求 2.找到合适的generator (opens new window)

# 补充 - 创建自己的generator

  1. 安装generator
npm install yeoman-generator

  1. generator 基类介绍 initializing -- 初始化方法（检查状态、获取配置等） prompting -- 获取用户交互数据（this.prompt()） configuring -- 编辑和配置项目的配置文件 default -- 如果 Generator 内部还有不符合任意一个任务队列任务名的方法，将会被放在 default 这个任务下进行运行 writing -- 填充预置模板 conflicts -- 处理冲突（仅限内部使用） install -- 进行依赖的安装（eg：npm，bower） end -- 最后调用，做一些 clean 工作

  2. 自定义 Generator

generator v5.0版本特性 (opens new window)

npmInstall不可用怎么办 (opens new window)

spawnCommand - Yeoman 生成器完成后非嵌套方式同步执行命令行操作 (opens new window)

# Plop

创建特定类型文件

# 搭建自己的CLI

# my-cli

←