##入门前的准备
###掌握一点命令行基础
你一定听说过DOS,DOS是一个命令行操作系统,有很多命令行操作方法,在现今的GUI操作系统里依然可用的。
下面只介绍我们最常用的几个操作命令,更多的命令就需要大家日后去勤奋自学了。
如果你对命令行操作已经有了一定的基础,那么可以略过此章节。
####dir / ls +文件夹路径
列出当前文件夹下的所有文件
dir是windows下CMD命令行工具,ls是苹果MAC操作系统里的命令行方法,功能一样的,请大家对号入座
dir或ls后面还可以加文件夹路径,显示文件夹路径里的所有文件,如: dir d:/test
,显示D盘test文件夹下的所有文件。
####cd +文件夹路径
切换到某个文件夹下,比如我们要切换到D盘的test文件夹,cd d:/test
,返回至上一层目录:cd ..
,返回到根目录cd /
,这几个常用命令请牢记。
####cd 的小技巧
cd 或rm之类的需要选取文件名的操作,可以不必敲出文件名的全称,它其实自带有一个搜索功能,比如我们要选取一个文件名叫test_abcsefg.js的文件,不需要全部cd +全名,可以这样操作:cd te
再按下tab键盘,命令行就会自动帮你补全名字了。
####rm +文件名 删除文件
删除文件
比如删除一个当前文件夹下test.js的文件,命令:rm test.js
,也可以删除任意位置的文件,如:rm d:/abc/test.js
删除文件夹下的所有文件,可以用通配符,如命令:
rm
,注意:当前文件夹或指定文件夹下不能有子文件夹,不然操作会失败,提示错误。
####mkdir +文件夹名称
新建文件夹
操作命令,如:mkdir test
,在当前目录下新建一个名叫test的文件夹。
####rmdir +文件夹名称
删除文件夹
操作命令,如:rmdir test
,在当前目录下删除一个名叫test的文件夹。注意:要删除文件夹,必须先保证文件夹为空,如果不为空,请先删除文件夹下的所有文件再做删除文件夹操作。
####pwd
查看当前目录的路径
常常我们cd到某个文件夹下,操作过多之后就忘记了当前所在的路径,可以用命令行pwd
直接查看文件夹的系统绝对路径。
###open +文件夹名
在系统中弹出文件夹窗口
如果你突然不想用命令行操作界面去操作文件了,想打开某个文件夹窗口呢?也可以用简单的命令行操作,如命令行:open test
,打开当前文件夹下的test文件夹,试下,是不是直接打开了?减少频繁去用鼠标操作的麻烦。
##搭建前端工程化环境
FIS是百度FEX团队开发的,基于node.js的一套前端自动化工具,它能为我们解决哪些问题呢?
- 在开发过程中做到浏览器自动刷新(代码监听,代码发布),有效避免了前端工程师写一样样式手动刷新下浏览器的麻烦
- 项目自动发布。可以发布到本地,也可以发布到远程服务器,只需要简单的一个命令
- 代码自动添加版本号
- 自动检查代码
- 代码自动化测试
- 代码自动打包
- 代码自动压缩
- 模块化开发
- 自动性能优化
- icon图片自动合并
根据配置安装的FIS插件,可以扩展更多的功能,提升前端码农的生产效率
###让我们首先来安装node.js环境吧
很简单,请打开链接http://nodejs.org,点击INSTALL按钮,网站会判断你是windows系统或MAC系统提供你对应的安装版本,下载后直接安装。
###安装fis-pure
在此先介绍下npm,npm是一个资源库,类似于苹果的APP商店,官方的node.js已经集成了npm安装包,已经自动安装,可以直接操作npm。
在npm的资源库里已经存在了fis-pure的安装包,我们可以输入命令:npm install fis-pure -g
,如果你用的是MAC,可能系统会提示你权限不够,那么就要提升到管理员权限,npm命令前增加sudo命令:sudo npm install fis-pure -g
,如果弹出窗口要求输入管理员用户名和密码,请按照要求操作。OK,安装完成了!
fis-pure已经安装到node的全局环境里了!
fis-pure是基于fis做了一层封装,是一套纯前端的工程化方案,都是基于pure的命令行操作
###我们用工程化的方式开始开发项目吧
####构建项目
再次运行FIS构建项目
资源压缩 –optimize 简写 -o
增加MD5版本号 –md5 简写 -m
项目打包 –pack 简写 -p
3个命令合并简写:fis release -omp
开启服务器,刷新浏览器即可看到
未完待续……