前端包管理Bower入门教程

Bower了解

bower是twitter的一个开源项目，使用nodejs开发，用于web包管理。若是愈来愈多得开源项目都托管在github上，bower只须要将github上项目加上一个配置文件既可使用bower方式使用安装包。做为包管理，bower能提供添加新web包，更新web包，删除web包，发布web包功能，管理包依赖。web包一般认为由html+css+javascript构成。javascript

环境依赖

bower是依赖于 Node.js的，因此安装以前须要Node环境，Node.js官网css

安装最新版本，而后命令行中严重是否安装成功html

node -v  //版本号查询  个人是v10.16.0

安装Bower

bower官网前端

优势：项目依赖安装，能够固定资源文件，支持资源版本升级，能够支持缓存安装等
全局安装bowerjava

npm install -g bower  //若是你以为npm安装较慢，能够用淘宝镜像cnpm安装

安装完成后，查询版本号node

bower -v  //若是出现对应的版本号说明安装成功

Bower 使用

建立文件夹（以个人为例，建立了一个空文件夹bowerDemo），而后命令行到该空文件下jquery

cd bowerDemo

初始化bowergit

bower init

会提示你输入一些基本信息，根据提示按回车或者空格便可，而后会生成一个bower.json文件，用来保存该项目的配置github

插件安装

接下来你就能够安装插件了，好比安装下载jquery,在根目录先输入下面命令安装web

bower install jquery --save

安装成功后你就会在跟文件夹里看到一个bower_components文件夹，这也是插件默认的文件夹

你也能够输入命令查询包的信息，输入命令后会出现包的因此版本，而后你就能够更新安装不一样的版本

bower info jquery  //包的信息
bower update   //包的更新
bower uninstall jquery  //包的卸载

这就是一个简单的bower的安装以及插件包的下载

固然，这些仅仅是不够的，做为一个前端开发，有时候会写不少html，css，js页面，甚至每次建立新的项目，都要用一样的模板，因此这个时候，就用到bower的注册功能，把本身的包或者插件发布到bower平台，并下载使用。

bower平台发布插件并下载

首先打标签（假设你已经把项目模板发布到github上面），在你的本地仓库根目录下运行下面命令

// -a是添加 标签名，通常写版本号, -m为标签添加注释信息
git tag -a 1.0.0 -m “version info″

// –tags参数表示提交全部tag至服务器端，普通的git push origin master操做不会推送标签到服务器端
git push origin --tags

一切准备就绪后，开始注册插件

bower register projectName  项目的github地址   
eg：bower register fontend https://github.com/mengnn/fontendGet.git

这样，你的插件就注册成功了，你就能够在你的项目根目录下下载你的插件（模板），也就不用每次重复的copy

bower install  fontend --save-dev  //fontend是我注册的插件名称

运行成功，你就能够看到你的模板下载到你的项目文件夹下面，just so so！

此时你的bower.json文件里面也会相对应的出来你安装的插件配置信息（版本号，名称）

ok，到这里就结束了，虽然如今bower已经中止维护了，可是这门技术仍是存在的，固然对于“玩家”来讲，实在有趣！