web前端开发环境搭建

操作系统：windows

 

1、JDK

　　截止至目前，JDK最新版本为1.8，下载地址：http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html

　　下载下来是一个exe文件，双击运行安装即可；

　　安装完成后需配置环境变量，怎么配置环境变量？网上教程一大堆，这里不再敖述；

　　安装成功检验方法：

　　　　打开cmd，输入java -version 回车，若出现以下输出则表示安装成功：

　　　　

2、NodeJS

　　官方下载地址：https://nodejs.org/en/

　　下载完成后双击运行安装

　　安装成功检验方法：

　　打开cmd，输入node -v回车，若出现以下输出则表示安装成功：

　　

　　或输入npm，若出现以下输出则表示安装成功：

　　

3、Ruby&SASS

　　由于sass是基于Ruby实现，故需安装Ruby环境，和Java差不多。

　　安装教程：http://www.w3cplus.com/sassguide/install.html，发现这个教程不错，就不再重复描述了；

　　安装成功检验方法：

　　打开cmd，输入sass -v回车，若出现以下输出则表示安装成功：

　　

4、Grunt

　　Grunt依赖nodeJS，所有必须先安装node环境；　　

　　安装Grunt其实是安装Grunt CLI

　　　运行命令：npm install -g grunt-cli （可能需要管理员权限）

　　　上述命令执行完后，grunt 命令就被加入到你的系统路径中了，以后就可以在任何目录下执行此命令了；

　　Grunt在具体项目中使用的时候是作为插件安装的：

　　　　npm install grunt --save-dev

5、Gulp

　　Gulp依赖nodeJS，所有必须先安装node环境；

　　全局安装Gulp

　　　运行命令：npm install --global gulp

　　具体项目中Gulp也是做为插件来使用的：

　　　　npm install --save-dev gulp

6、Apache配置

　　移动端测试的时候由于恼人的缓存问题，不能及时看到文件修改后的效果，通过设置服务器的文件过期时间能有效避免这类问题

　　打开Apache安装目录下conf/httpd.conf文件，找到“LoadModule expires_module modules/mod_expires.so”这一行，把前面的#号去掉；

　　然后在该行下边添加如下代码：　

　　　　<IfModule mod_expires.c>
　　　　　　ExpiresActive On
　　　　　　ExpiresDefault "access plus 1 seconds"
　　　　</IfModule>

　　找到DocumentRoot，设置其值为你的工作目录，这样你工作目录的文件就直接发布到Apache文件目录下了；

　　

　　Google Chrome去缓存的方法：

　　　　打开网络监控面板，勾选disable cache选项，这样Chrome就不会使用本地缓存了