bower 是什么，怎么使用

最新推荐文章于 2023-07-12 10:02:47 发布

宋俊波

最新推荐文章于 2023-07-12 10:02:47 发布

阅读量1.2k

点赞数

CC 4.0 BY-SA版权

分类专栏：【不错的工具--工欲善其事】文章标签： bower

本文链接：https://blog.youkuaiyun.com/JunBo_Song/article/details/52131113

【不错的工具--工欲善其事】专栏收录该内容

7 篇文章

订阅专栏

本文介绍Bower的基本概念、安装步骤及如何使用Bower进行前端资源的管理，包括初始化配置、安装依赖、更新与卸载包等操作。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

【一】Bower是一个客户端技术的软件包管理器，它可用于搜索、安装和卸载如JavaScript、HTML、CSS之类的网络资源。

【二】前提

1.安装node环境

2.安装Git，因为bower是从远程git仓库获取代码包

【三】安装bower

1.npm install -g bower(mac 下需要在前面加sudo获取权限：sudo npm install -g bower)

2.bower install

【四】bower 初始化

bower init(会提示你输入一些基本信息，根据提示按回车或者空格即可，然后会生成一个bower.json文件，用来保存该项目的配置),以下是我ionic 项目的bower 配置文件内容：

{
  "name": "cmos-integrated-promotion-app",
  "private": "true",
  "devDependencies": {
    "ionic": "driftyco/ionic-bower#1.3.1"
  },
  "dependencies": {
    "ng-file-upload": "^12.0.4"
  }
}

【五】包的安装方法

进入项目目录，执行以下命令：

bower install ng-file-upload --save

然后bower就会从远程下载jquery最新版本到你的js/lib目录下
其中--save参数是保存配置到你的bower.json，你会发现bower.json文件已经多了一行：

 "dependencies": {
    "ng-file-upload": "^12.0.4"
  }

【六】查看包的想关信息

通过执行 bower info ng-file-upload

【七】更新包或者安装其他版本的包

执行第五步安装的包默认安装最新版本的，若想安装其他版本，可直接修改bower.json文件中的jquery版本号如下：

 "dependencies": {
    "ng-file-upload": "^12.0.4"
  }

然后执行命令：bower update

【八】包的查找

比如我想要安装bootstrap的某个插件，但是记不住名字了，可执行命令行：bower search bootstrap，bower就会列出包含字符串bootstrap的可用包了

【九】包的卸载

执行命令 bower uninstall ng-file-upload