# part2-fed-e-task-02-01 **Repository Path**: ping_pong_wf/part2-fed-e-task-02-01 ## Basic Information - **Project Name**: part2-fed-e-task-02-01 - **Description**: No description available - **Primary Language**: Unknown - **License**: Not specified - **Default Branch**: master - **Homepage**: None - **GVP Project**: No ## Statistics - **Stars**: 0 - **Forks**: 0 - **Created**: 2021-06-01 - **Last Updated**: 2021-06-02 ## Categories & Tags **Categories**: Uncategorized **Tags**: None ## README ## 简答题 **1、谈谈你对工程化的初步认识,结合你之前遇到过的问题说出三个以上工程化能够解决问题或者带来的价值。** 答: 前端工程化是遵循一定的标准和规范,通过工具提高效率,降低成本的手段。工程化主要解决的问题: 传统语言或语法的弊端、无法使用模块化,组件化、重复的机械式操作、 代码风格统一,保证质量、依赖后端服务接口支持、整体依赖后端项目 工程化体现地方:脚手架工具开发、自动化构建系统、模块化打包、项目代码规范化、自动化部署  我之前遇到问题,代码风格不统一,开发质量得不到保证,开发时间长,重复操作工作多   **2、你认为脚手架除了为我们创建项目结构,还有什么更深的意义?** 答: 规范代码风格统一,降低成本,提高效率,保证质量   ## 编程题 **1、概述脚手架实现的过程,并使用 NodeJS 完成一个自定义的小型脚手架工具** 脚手架的工作过程 1.根据命令行交互询问用户问题 2.根据用户回答的结果生成文件 实现的过程: 1、初始化package.json文件 2、创建入口文件:cli.js,文件内容开头必须是:#!/usr/bin/env node 3、安装模块inquirer和 模板引擎渲染 ejs: yarn add inquirer yarn add ejs code: #!/usr/bin/env node const fs = require("fs") // 文件路径获取模块 const path = require("path") // 用户询问发起需要inquirer.prompt,需要安装 const inquirer = require("inquirer") //模板引擎渲染模块 const ejs = require("ejs") inquirer.prompt( [ { type: "input", // 输入方式 name: "name", // 问题返回键 message: "project name?" // 用户提示 }, { type: "input", // 输入方式 name: "version", // 问题返回键 message: "current version 1.0.0?" // 用户提示 } ] ).then(anwsers =>{ // anwsers可以拿到用户输入的内容 // 根据用户回答的结果生成文件 // 获取模板目录 const tmplDir = path.join(__dirname, "templates") // 目标目录 const destDir = process.cwd() // 将模板下的文件全部转换到目标目录下 fs.readdir(tmplDir,(err, files)=>{ if(err)throw err files.forEach(file =>{ // 通过模板引擎渲染文件 ejs.renderFile(path.join(tmplDir,file), anwsers, (err,result)=>{ if(err)throw err // 将结果写入目标文件路径 fs.writeFileSync(path.join(destDir,file),result) }) }) }) }) **2、尝试使用 Gulp 完成项目的自动化构建** ( **[先要作的事情](https://gitee.com/lagoufed/fed-e-questions/blob/master/part2/%E4%B8%8B%E8%BD%BD%E5%8C%85%E6%98%AF%E5%87%BA%E9%94%99%E7%9A%84%E8%A7%A3%E5%86%B3%E6%96%B9%E5%BC%8F.md)** ) (html,css,等素材已经放到code/pages-boilerplate目录)     ## 说明: 本次作业中的编程题要求大家完成相应代码后 - 提交一个项目说明文档,要求思路流程清晰。 - 或者简单录制一个小视频介绍一下实现思路,并演示一下相关功能。 - 说明文档和代码统一提交至作业仓库。