前端自动化工具

前端自动化

1. 以下都是用淘宝 npm -> cnpm

========================================================

1. YEOMAN: http://yeoman.io/ : 构建项目脚手架
安装: cnpm install -g yo
检查版本: yo --version

2. Bower: https://bower.io/ : WEB 包管理器
安装: cnpm install -g bower
检查版本: bower -v

3. Grunt: http://www.gruntjs.net/getting-started : 构建工具: 自动化.对于需要反复的任务,比如压缩, 编译,单元测试等,自动化工具可以减少你的劳动, 简化你的工作
安装: cnpm install -g grunt-cli
检查版本: grunt -v

===================================================================
1. 使用 yeoman
1). 安装 generators: http://yeoman.io/generators/
2). 安装 angular: cnpm install -g generator-angular
安装通用: cnpm install -g generator-XXX
3).

===================================================================
2. 使用 bower
以下安装的都是名字有名的库
1). bower install jquery 安装 jQ
2). bower install bootstrap 安装 bootstrap

如果想安装小库的话, 可以使用 github 短语

项目的完整 github 地址

可以直接使用 url 安装

===========================================================
1. mkdir: 创建目录
2. cd: 到哪个目录
3. pwd: 查看当前目录
4. ls (-al): 当前目录下的文件
5. rm -rf: 递归删除
6. vim index.html 使用 vim 打开文件
:q 退出文件

时间: 2024-10-13 08:29:05

前端自动化工具的相关文章

前端自动化工具 grunt 插件的简单使用(一)

Grunt 的简介: Grunt 是一套前端自动化工具,是一个基于 node.js 的命令行工具,它一般用于: 1.压缩文件: 2.合并文件: 3.简单的语法检测: 4.监听文件变动: 5.less 编译: PS:Grunt 官网 (https://gruntjs.com/).Grunt  就像是一个工具箱,拥有非常丰富的任务插件,可以帮助开发人员实现各种各样目标任务的构建.在Grunt工具箱中,按目标任务类型我们可以分为: 1.编译文档型:比如编译 LESS.Sass.Stylus.Coffe

前端自动化工具 -- fis 使用简介

FIS也是一个新生的前端自动化工具,好下面就来简单介绍一下,真的好简单介绍啊.. 个人觉得FIS已经囊括了一个“大前端”的范畴. 先来看看别人怎么看FIS和Grunt和Gulp F.I.S在实际项目中的应用体验如何? 前端工具里面gulp和fis,有哪些优缺点? FIS和Grunt的区别 FIS入门很简单,提高难度也不大,因为官方已经提供了非常多的文档 围绕着最基本的三条命令 fis install <name> fis release [options] fis server <com

HTML5技术分享:前端自动化工具推荐

随着前端开发技术的不断发展,前端开发工作也变得越来越复杂,如果能合理地采用一些自动化的工具,生活要容易得多. LiveReload 我目前的开发主力机是一台较早的 13寸 Macbook Pro,外加一台戴尔的显示器.相信做前端开发的都知道,这多出来的一台显示器对工作效率的提升有多大. LiveReload 技术+两块显示屏可以帮你省去重复刷新浏览器这一枯燥的工作.目前实现 LiveReload 的方式很多,如果你倾向于图形化的桌面应用,可以尝试一下 LiveReload.app, 地址是:ht

前端自动化工具 -- gulp 使用简介

gulp是基于流的前端自动化构建工具. 之前也谈到了 grunt的用法,grunt其实就是配置+配置的形式. 而gulp呢,是基于stream流的形式,也就是前一个函数(工厂)制造出结果,提供后者使用. 同样的,也是包括基本用法和各插件的使用. 一.环境配置 gulp是基于nodejs的,所以没有 nodejs 环境的要先去安装好 然后给系统配上gulp环境 npm install -g gulp 再到某一工程目录下 跟grunt一般,也是需要package.json包依赖文件和一个入口文件 g

gulp 前端自动化工具

一开篇 在前端开发的过程中,我们经常会碰到压缩.合并.图片script 等,于是就有了gulp 前端自动化构建工具,它能帮你在前端开发中,节省时间. 1,安装 node.js 因为gulp 构建工具是基于node环境的,那么什么是 node.js呢,下面是官方的解释Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境.Node.js 使用了一个事件驱动.非阻塞式 I/O 的模型,使其轻量又高效.Node.js 的包管理器 npm,是全球最大的开源库生态系统. 用

Grunt-beginner前端自动化工具-高清视频

[课程介绍]: 作为一名开发人员,在WEB前端项目开发中,重复而枯燥的工作太多,Grunt自动化的项目构建工具,帮你解决这些问题,对重复执行的任务像压缩,合并,编译,单元测试及代码检查等, 通过配置Grunt自动化工具,可以减轻您的劳动,简化您的工作. [课程须知]: 1.想提高运行前端开发工作流程 : 2.有一些项目开发经验,效果会更好. [你能学到什么?] 1. Grunt工具和插件的安装 2. 如何进行项目配置 3. 如何配置任务 4. 如何执行任务 5. Grunt的使用 [课程提纲]:

前端自动化工具 -- grunt 使用简介

grunt是什么,grunt就是个东西.. grunt作为一个前端构建工具,有资源压缩,代码检查,文件合并等功能. 下面就简单了解grunt的使用. 一.环境配置 grunt是基于nodejs的,所以需要一个 nodejs 环境,未了解的可以 来这看看 还是在windows下, 首先要保证grunt命令可以使用,所以要先使用npm安装对应CLI npm install -g grunt-cli 安装完成可以命令行中输入“grunt”测试是否安装成功 安装成功后 二.用法说明 grunt需要pac

(转)Bootstrap 之 Metronic 模板的学习之路 - (7)GULP 前端自动化工具

https://segmentfault.com/a/1190000006738327 初步了解 Metronic 的结构和应用后,我们就可以在项目中应用起来了.考虑到实际项目应用时,会有很多文件需要修改调整并压缩处理,这时候我们就会用到我们的<前端自动化神器 (Gulp)>,鉴于 gulp 的内容比较多,为了不打乱 Metronic 系列,就单独列了一篇<初探前端自动化神器 (Gulp)>.本文不对 gulp 进行详细阐述,只保留和 Metronic 相关部分. Gulp is

【gulp】前端自动化工具---gulp的使用(一)------【凡尘】

什么是gulp?   基于node的自动化构建工具 扩展:开发的时候分为2个节点一个是开发阶段  另一个是部署阶段 开发阶段:源文件不会被压缩 部署阶段:所有文件需要压缩 002.gulp能干什么? 1  自动压缩JS文件 2  自动压缩CSS文件 3  自动合并文件 4  自动编译sass 5  自动压缩图片 6  自动刷新浏览器 ........... 003.怎么安装gulp? 因为它基于nodeJS,因此需要先安装node环境 安装完成后,打开你的命令行窗口 输入: node -v 检测