Bower的基本使用

Bower的使用

1 Bower简介

• Bower官网
• 其功能和npm类似.利用bower可以管理插件/类库.是1个前端包管理工具.
• 其直接从github下载.其依赖于git和npm
• Bower是1个前端的插件市场 npm是1个前后端的插件市场.
• npm https://www.npmjs.com/
• bower github

2. Bower安装

• 安装nodejs 拥有npm工具.
• 安装git
• 使用npm安装bower npm install -g bower

3. Bower使用

• 可以在git bash中使用使用bower,也可以直接在命令行工具中使用bower
• 一般使用步骤
  
  • 初始化bower bower init 该命令用来在项目文件夹中初始化bower环境,生成配置文件.
  • 使用bower install xxx --save命令来进行安装.
    
    • 会在当前项目目录下生成1个bower_components目录,将包存储在其中.
    • 指定下载目录的方式.
      
      • 新建.bowerrc文件
      • {directory:"app/vendor"}
  • 使用bower uninstall xxx --save命令来移除包

4. Bower的特点

• 如果A包依赖于B包.那么在下载A包的时候 会自动下载B包.
• 在A包没有删除的情况下,无法删除B包.
• 在删除A包的时候,如果无其他包依赖A 会连着A一起删除.否则不会删除A.

1.Browser-sync简介

• 当代码发生改变以后,浏览器就自动刷新.
• 这是browser-sync提供的最主要的功能

2.browser-sync安装

• npm install browser-sync -g 使用该命令全局安装.
  
  • -dev参数作用: 代表该插件是供开发阶段使用,并不是给用户使用的.

3.browser-sync使用

• 在项目文件夹中执行命令browser-sync start --server --files "指定要监视的文件"
• 这个时候,会启动服务 自动打开网页
• 当我们修改代码 保存的时候 浏览器就会自动刷新.
• files参数可以使用通配符,也可以指定多个需要监视的文件.文件名之间使用逗号分隔.

4.浏览器兼容性测试.

• 浏览器操作将会被同步.

5.browser-sync后台

• 可以设置具体的同步参数.