这一期，我分享给大家三点看源码的小技巧，这也是从别的大佬那总结的。
被反复使用的代码这样的代码是一个软件的重点函数，一个大神的写法有很多精华值得学习。
穿越时间的代码如果一段代码10年甚至15年，都还在使用。说明它的设计思想一定很棒。
好调试的代码一个程序的代码很容易就调试成功，说明作者的项目结构能力很强，值得学习。
前言今天，我们来搞一个新东西，名字叫基于Vue技术栈的全栈热重载生产环境脚手架。实话说，这个名字我想了很久。最终，还是以这个名字作为文章标题。我先拆分解释下：全栈的意思是支持前后端；热重载这个名词相信大家很熟悉，就是页面每次改动，不需要手动去刷新，可自动刷新；生产环境这里你可以理解成线上环境，用户使用的环境。
缘起为什么会想到开发这样的一款项目呢？我们平时可能更多地使用VueCLI或者Vite来开发Vue项目，但是如果就单纯开发一个简单的网页，未免有点小题大作了。
这时，我们可能会用到Vue的生产环境版本。但是，这样的话我们就不能用VueCLI、Vite那样的热重载功能，就需要不停的刷新网页。如果在编辑器中对html文件增加或删除了元素，或者是在css文件中修改了某个元素的某个样式，然后想在浏览器中看到效果，通常的步骤是：把窗口切换到浏览器，然后按键盘上的F5刷新页面。在制作页面的时候这个动作可能会重复很多次。我们开发效率就大大地减少了。
所以，我们有必要开发一款可热重载的生产环境脚手架。如果增加模拟数据接口服务，那就更完美了。光说不练假把式，我们就开发一款基于Vue技术栈的全栈热重载生产环境脚手架。
实战一、初始化项目首先，我们建一个空文件夹，名字可以叫gulp-vue-cli，这就是项目根文件夹。相信聪明的小伙伴可以看出，我们今天的主角是gulp。建完项目根文件夹之后，我们会使用命令快速生成package.json文件。
npminit-y二、创建前端项目与后端项目
下一步，我们会在创建好的项目根文件夹内创建一个前端项目文件夹，名字可以叫src。另外，后端项目文件夹名字叫server。
下一步，我们先在src文件夹下创建一个前端项目，以下为目录详情：
css---存放样式目录js---存放逻辑文件目录imgs---存放图片目录index.html---项目主页面
index.html
!DOCTYPEhtmlhtmllang="en"headmetacharset="UTF-8"/meta