北京WEB前端培训
在线咨询 电话咨询 校区地址

课程

环境

就业

试听

企业培训

扫码
关注

首页 / 

行业资讯

北京web前端培训 把工作还给机器-前端自动化介绍

时间: 来源:火星人

前端构建工具——实现前端代码的辅助编译、压缩、测试;图片的压缩以及浏览器自动刷新等等功能。

先来说说为什么要自动化。凡是要考虑到自动化时,你所做的工作必然是存在很多重复乏味的劳作,很有必要通过程序来完成这些任务。这样一来就可以解放生产力,将更多的精力和时间投入到更多有意义的事情上。随着前端开发不再是简单的作坊式作业,而成为一个复杂的工程时,还涉及到性能优化一系列工作等等,这时自动化已然是迫切的需求。

在还没有前端工程师这种分工如此明确的岗位时,大家所理解的前端工作无非就是制作网页的人,包括html、css、js等。稍微高级点的可能就是PHP了,可以读写数据库,可以称之为动态的网页。通过近几年的发展,分工越来越细,在大公司如BAT三家,基本是把前端分开来了,有专门的人写js,有专门的人写css。以前一个网页可以一个人搞定,包括切图,写页面到写逻辑,无非是几个资源链接拼凑起来。当然逻辑性不强,页面不重。

如今的前端开发中,已经不再只是一些简单的静态文件了,对于很多Web App来说,前端代码甚至比后端代码要更加复杂,更加难于管理。所以构建一个自动化的前端开发流程是非常必要的

我们能用前端自动化工具做什么?

兼容性测试
CSS压缩合并
CSS前缀添加
JS、CSS语法检测
JS代码压缩
图片压缩
大规模文本处理


现在给大家简单介绍三款前端自动化工具,具体的请大家百度,要比我这的详细的多


Gulp

Gulp是一个构建系统,开发者可以使用它在网站开发过程中自动执行常见任务。Gulp是基于Node.js构建的,因此Gulp源文件和你用来定义任务的Gulp文件都被写进了JavaScript(或者CoffeeScript)里。前端开发工程师还可以用自己熟悉的语言来编写任务去lint JavaScript和CSS、解析模板以及在文件变动时编译LESS文件(当然这些只是一小部分例子)。 Gulp本身虽然不能完成很多任务,但它有大量插件可用,开发者可以访问插件页面或者在npm搜索gulpplugin就能看到。例如,有些插件可以用来执行JSHint、编译CoffeeScript,执行Mocha测试,甚至更新版本号。


Yeoman

Yeoman 1.0版本不仅仅是一个工具,它还是一个工作流;一个让web开发和谐甚至变得更好的工具和最佳实践的集合。
我们的工作流致力于提高你在构建web应用时的生产力和舒适度,由三种核心工具构成:yo(脚手架工具),bower(包管理工具),grunt(构建工具)。


Grunt

Grunt是一种自动化任务处理工具,它就是一个工具框架,有很多插件扩展它的功能。
Grunt 基于 Node.js ,用 JS 开发,这样就可以借助 Node.js 实现跨系统跨平台的桌面端的操作,例如文件操作等等。此外,Grunt 以及它的插件们,都作为一个 包 ,可以用 NPM 安装进行管理。
所以 NPM 生成的 package.json 项目文件,里面可以记录当前项目中用到的 Grunt 插件,而 Grunt 会调用 Gruntfile.js 这个文件,解析里面的任务(task)并执行相应操作。


关键词:北京web前端培训,北京web前端,web前端,北京JS培训,北京JQ培训

热门课程推荐  点击查看全部课程

北京UI培训
  • 北京web前端培训
  • 北京UI培训
  • 北京web前端培训
  • 北京UI培训
  • 北京web前端培训
  • 北京UI培训
  • 北京web前端培训
北京UI培训
  • 14年教育品牌
  • 课程不断更新
  • 签订就业协议
  • 项目案例讲解
  • O2O教学模式

北京火星人科技文化发展中心版权所有 Copyright & copy 2002-2016 2ds.cn, All Rights Reserved 京ICP备 10216795号