前端工程化

一、谈谈你对工程化的初步认识，结合你之前遇到过的问题说出三个以上工程化能够解决问题或者带来的价值。

一切以提高效率、降低成本、质量保障为目的的手段都属于「工程化」。

主要解决问题：

• 传统语言或语法的弊端

如想要使用ES6+新特性，但兼容有问题；想要使用Less/Sass/PostCSS增强CSS的编程性，但是运行环境不能直接支持

• 无法使用模块化/组件化

想要使用模块化的方式提高项目的可维护性，但运行环境不能直接支持

• 重复的机械式工作

部署上线前需要手动压缩代码及资源文件，部署过程需要手动上传代码到服务器

• 代码风格统一、质量保证

多人协作开发， 无法硬性统一大家的代码风格，从仓库pull回来的代码质量无法保证

• 依赖后端服务接口支持

部分功能开发时需要等待后端服务接口提前完成

• 整体依赖后端项目

二、你认为脚手架除了为我们创建项目结构，还有什么更深的意义？

从以下几个阶段说起：

创建项目

• 创建项目结构
• 创建特定类型文件

编码

• 格式化代码
• 校验代码风格
• 编译/构建/打包；

预览/测试

• Web Server/Mock
• Live Reloading/HMR
• SourceMap

提交

• Git Hooks
• Link-staged
• 持续集成

部署

• CI/CD
• 自动发布

三、概述脚手架实现的过程，并使用 NodeJS 完成一个自定义的小型脚手架工具

工作过程：

通过命令行交互询问用户问题 -> 根据用户回答的结果生成文件 -> 动态生成项目文件

NodeJS自定义小型脚手架

基本用法如下：

mkdir myself-cli
cd myself-cli
yarn init

在生成的package.json文件中添加 "bin" 字段指定入口文件 ”cli.js“，

添加 "cli.js" 文件，Node CLI应用入口文件必须要有这样的文件头

#!/usr/bin/env node

文件内容完成后

yarn link //发布到全局
myself-cli //执行

整理这个的是一些大企业的大佬，认真地和他们学习了很多经验以及获取了很多直观的资料，现在全部拿出来奉献给大家！

想系统学习WEB前端的朋友，可以加这边的交流裙（1146649671）学习资料、面试资料、视频资源，资源给你们拉满，不见不散哦~