WEB前端开发工具的初识

准备学习BootStrap，然后发现好多插件啊……

从一个开源项目开始学习吧。

     required node.js & bower & grunt

     $ git clone https://github.com/onokumus/Bootstrap-Admin-Template.git yourfoldername
     $ cd yourfoldername
     $ npm install
     $ bower install
     $ npm run buildrtl
     $ grunt serve

一、node.js

大名鼎鼎的node.js，在这个项目里只被用做打包工具。

去官网下载适合自己开发环境的软件版本，很细致啊，对arm这种架构都做了专门的支持和优化。

个人下载了node-v4.2.4-linux-x64.xz版本，解压后，和tomcat的目录感觉使用是一样的，运行脚本在bin目录下。

做了一个全局命令软链接：

sudo ln -sf /home/yourname/softwarepath/node-v4.2.4/bin/npm /usr/local/bin/

二、bower

这是一个类似Java开发中的gradle一样的js插件安装工具，解决了版本间依赖和版本问题。

npm install bower

安装完以后，默认路径是{your true path}/node-v4.2.4/lib/node_modules/下。

按照官网上的说法npm install -g bower就能进行全局安装，命令可以自由调用。

然而我这样做却没有任何效果，应该是权限的原因，没关系，咱可以做全局软链接啊。

三、grunt

这是一个用来给项目中所有的js和css这些文件压缩的工具（功能肯定不限于此）。

npm install grunt

这个可花了我一些时间，因为在其安装包里找不到bin目录？！

去官网看了半天，npm install grunt-cli解决问题。

四、另一个花费不少精力解决的问题

执行bower install，在googlecode上的jquery-inputlimiter.1.3.1.zip无法下载，最直接的想法是翻墙，结果徒劳……

绕路的解决方法：

1.先去国内网站或者能访问的国外网站上下载需要的软件包。

2.找到bower.json中devDependencies项目的下载安装路径。此项目路径是{project}/src/assets/lib/。

3.将下载的软件包手动的解压到步骤2的目录下。

4.删除bower.json中改软件的依赖（其实是有风险的，就是手动安装的软件包可能涉及其他的软件包，但是原理是一样的）。

5.再次执行bower install，通过。

最后，执行grunt serve，竟然能直接访问该项目（非本地文件访问），就是说grunt能够当web服务器用，应该是node.js的功劳吧，我猜。