Canvas开发的前端页面自动化实现求助

发布网友发布时间：2022-04-28 18:12

共1个回答

热心网友时间：2022-04-20 00:08

现在的前端开发已经不再仅仅只是静态网页的开发了，日新月异的前端技术已经让前端代码的逻辑和交互效果越来越复杂，更加的不易于管理，模块化开发和预处理框架把项目分成若干个小模块，增加了最后发布的困难，没有一个统一的标准，让前端的项目结构千奇百怪。前端自动化构建在整个项目开发中越来越重要。

我们首先来回想一下之前我们是如何来开始做一个项目的。

① 首先要确定这个项目要使用什么样的技术来实现，然后开始规划我们的项目目录，接着就要往项目增加第三方库依赖，比如：

拷贝 CSS库（Yui Reset | bootstrap）JS库（Requiet.js | Seajs | jQuery | jQuery插件）进相应目录（拷贝 N个文件，花费N分钟）

② 然后，进行编码

编辑器编码 => 切换到浏览器F5 => 编辑器编码 => 切换到浏览器F5 => 编辑器编码 => 切换到浏览器F5 => 编辑器编码 => 切换到浏览器F5 …………

③ 编码完成，进行语法检查，文件合并和压缩

HTML去掉注析、换行符 - HtmlMin

CSS文件压缩合并 – CssMinify

JS代码风格检查 – JsHint

JS代码压缩 – Uglyfy

image压缩 - imagemin

整个过程都在重复无用繁琐的工具...

渐渐的，一些自动化构建工具出现了，人们开始使用例如Bower、Gulp、Grunt、node、yeoman等等工具来构建一个本地的开发环境。自动化构建已经成了前端开发的趋势，所以学好自动化构建也就是为自己的开发打下了良好的基础。