浅谈Web前端开发软件包管理器—Bower的基本使用

news2024/10/6 5:55:59

前言

Bower 是一个客户端的软件包管理器，它可用于搜索、安装和卸载如 JavaScript、HTML、CSS 之类的网络资源，Bower 是 Web 开发中的一个前端文件包管理器，类似于 Node 模块的 npm 包管理器，bower 依赖于 Git、Node 和 npm。 

安装 Bower

全局安装

使用 npm 安装 Bower。（Bower 依赖于 Node, npm 和 Git。）

$ npm install -g bower

Bower 初始化

命令行进入项目目录中，输入命令如下：bower init

会提示输入一些基本信息，根据提示按回车即可，通过问答向导的方式在当前目录生成一个bower.json文件，用来保存该项目的配置。

基本用法

安装程序包

程序包安装命令 bower install，默认安装目录 bower_components/。

$ bower install <package>

package 可能是 GitHub Shorthand，或者是 Git 仓库地址，或者 URL。

# registered package
$ bower install jquery

# GitHub shorthand
$ bower install desandro/masonry

# Git endpoint
$ bower install git://githu.com/user/package.git

# URL
$ bower install http://example.com/script.js

更改默认安装目录

要更改默认安装目录，可在工作目录根路径下创建 .bowerrc，添加以下内容：

    {
        "directory": "my_components"
    }

关于 bower.json

Bower 使用 bower.json 作为程序包清单。（早期版本使用 component.json 作为清单文件）。

你可以使用 $ bower init 命令来创建 bower.json 文件，以下是 bower.json 示例：

{
  name: 'hello-world',
  version: '0.1.0',
  authors: [
    'Yin Zhenhua <hendikoy@gmail.com>'
  ],
  description: 'the first package.',
  main: 'hello.js',
  keywords: [
    'amd'
  ],
  license: 'MIT',
  ignore: [
    '**/.*',
    'node_modules',
    'bower_components',
    'test',
    'tests'
  ]
}

name

必填 注册到 bower 仓库的名字。
* 名字必须具有唯一性。
* 命名采取 slug style，例如 unicorn-cake。
* 名字包含小写字母、数字、连字符或英文句号（后两者不能位于开始和结束位置）。
* 不能连续使用连字符和句号。
* 不能多于 50 个字符。

version

暂时没有使用，目前 bower 使用 Git tag 作为版本号。

description

程序包简略描述，最多不超过 140 个字符。

main

为程序包建立一个入口文件是很有必要的，每一类型文件只能有一个入口文件。入口文件包含模块的输入物和导入物。

图片和字体文件可以被 JS 或 Sass 文件使用，因此它们不能算作入口文件。

*    使用含有模块输入物和输出物的文件作为入口文件。
*    不要使用压缩后的文件。
*    不要使用图片、字体、音频或视频文件作为入口文件。
*    文件名不要包含版本号。
*    不要使用 `js/*.js` 的这样用法。

dependencies

依赖包是一个键位包名，值为标识符或 URL 的哈希字典。

*    键必须是有效名字。
*    值必须是一个有效版本、Git URL 或 URL。
*    Git URL 必须在结尾处添加 # 符号，并附注 revision SHA，branch 或 tag。
*    如果是 GitHub 项目，则使用 owner/package 这样的简写方式。
*    本地调试时可以使用本地路径作为值。

devDependencies

调试依赖包和 dependencies 规则相同，但仅做本地开发时使用。

moduleType

在 main 中定义模块的类型。

*    `globals`：表示模块直接导入全局名字。
*    `amd`：符合 AMD 规范，例如 RequireJS，使用 `define()` 语法。
*    `node`：符合 node 和 CommonJS 规范，使用 `module.exports` 语法。
*    `es6`：符合 ECMAScript 6 模块规范，使用 `export` 和 `import` 语法。
*    `yui`：符合 YUI 模块规范，使用 `YUI.add()` 语法。

keywords

与 name 字段规则相同。

authors

作者名录。

homepage

主页。

repository

源文件所处仓库。

liscense

授权许可。

ignore

安装包的时候需要忽略的模块。

resolutions

如果两包发生冲突，则自动根据该字段解析依赖包。

private

如果设置为 true，则不能发布该包。这样做是为了避免意外发布。

维护依赖包

使用 bower install <package> --save 命令将 <package> 添加到 bower.json 的 dependencies 数组。

使用 bower install <package> --save-dev 命令将 <package> 添加到 bower.json 的 devDependencies 数组。

注册程序包

注册后的程序包可以使用 bower install <package> 命令进行安装。

*    包名必须符合 bower.json 规范。
*    项目根目录必须存在合法的 `bower.json` 文件。
*    包必须使用 [semver](http://semver.org/) Git tag。
*    你的包必须是公开的，其他人都可以访问到你的 Git 仓库，记住推送 Git tags。
*    对于私有包，使用私有的 [Bower Registry](https://github.com/bower/registry)。

使用 bower register 命令注册包：

$ bower register <my-package-name> <git-endpoint>

例如：

$ bower register example git://github.com/user/example.git

Bower 注册现在还不支持身份验证。

Bower 不支持 GitHub 风格的命名（org/repo），但你可以使用 - 符号来命名相关联的包，例如 angular-。

注销程序包

使用命令 bower unregister 注销你的代码包。你首先要使用 bower login 来验证 GitHub 身份，确保你是代码包的贡献者。

bower login
# enter username and password
? Username:
? Password:
＃unregister packages after successful login
bower unregister <package>

你也可以手动请求注销代码包。

API

cache

$ bower cache clean
$ bower cache clean <name> [<name> ...]
$ bower cache clean <name>#<version> [<name>#<version> ..]

清理缓存的程序包。

$ bower cache list
$ bower cache list <name> [<name> ...]

显示缓存的程序包。

help

$ bower help <command>

home

$ bower home
$ bower home <package>
$ bower home <package>#<version>

打开程序包主页。

info

$ bower info <package>
$ bower info <package> [<property>]
$ bower info <package>#<version> [<property>]

显示程序包或某一个版本的程序包信息。

install

$ bower install [<options>]
$ bower install <endpoint> [<endpoint> ..] [<options>]

安装项目依赖包，或者指定的终端地址集。

终端有三种形式：

*    <package>
*    <package>#<version>
*    <name>=<package>#<version>

其中：

*    <package> 是 URL，物理路径或注册名。
*    <version> 是有效范围、commit、分支等。
*    <name> 本地配置的名称。

lookup

$ bower lookup <name>

查询程序包 URL。

prune

$ bower prune

卸载本地多余程序包。

register

$ bower register <name> <url>

注册程序包。

search

$ bower search
$ bower search <name>

查找程序包。

update

$ bower update <name> [<name> ..] [<options>]

根据 bower.json 内容安装最新的程序包。

update options

* `-F`, `--force-latest`：强制安装最新版本（无论冲突与否）
* `-p`, `--production`：不要安装项目的 devDependencies。

uninstall

$ bower uninstall <name> [<name> ..] [<options>]

从本地 bower_components 目录卸载程序包。

uninstall options

* `-S`, `--save`：从 bower.json dependencies 中移除卸载的程序包。
* `-D`, `--save-dev`：从 bower.json devDependencies 中移除卸载的程序包。

unregister

$ bower unregister <package>

卸载程序包。

官网：Bower — a package manager for the web

参考资料

Node.js 自动化工具 - Bower

相关资料

Node.js 自动化工具 - Gulp

Node.js 自动化工具 - YEOMAN

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.coloradmin.cn/o/744315.html

如若内容造成侵权/违法违规/事实不符，请联系多彩编程网进行投诉反馈，一经查实，立即删除！

相关文章

HarmonyOS课程尝鲜计划，优享特权大礼包

HarmonyOS课程尝鲜计划，优享特权大礼包

报名入口&#xff1a;https://developer.huawei.com/consumer/cn/activity/901689042385499023
阅读更多...
Mendix Excel导入组件的分析和应用

Mendix Excel导入组件的分析和应用

一、前言 企业在发展的过程中会使用各种各样的系统&#xff0c;其中很多系统用了5-10年&#xff0c;我们称之为遗留系统存在诸多风险&#xff1a;维护耗时、中断频繁、用户不友好、与新软件的兼容性问题等。总有一天&#xff0c;这些庞大的问题会垄断IT资源&#xff0c;使数字…
阅读更多...
事物的属性与观察者有关吗？

事物的属性与观察者有关吗？

我们通常对世界的看法是以分析和概念为基础的&#xff0c;我们倾向于将事物划分为各种相对的存在和概念。然而&#xff0c;有些领域超越了这种相对的观点&#xff0c;揭示了所有现象的无常性、空虚性和无自性&#xff0c;认识到它们的真实本质。如在人机环境系统中就认为&#…
阅读更多...
【车载Android】多用户（一） - Linux用户与Android多用户

【车载Android】多用户（一） - Linux用户与Android多用户

现如今手机这样的移动设备已经是人手一台了&#xff0c;但是汽车依然是以家庭为单位使用&#xff0c;不同的家庭成员对于汽车的使用存在着差异&#xff0c;比如空间、功能、影音风格等。因此&#xff0c;“智能汽车”需要具备千人千面的特性&#xff0c;能够适应不同的用户和场…
阅读更多...
Linux中Makefile详细教程

Linux中Makefile详细教程

目录 Makefile Makefile的介绍 Makefile简单的编写 .PHONY 问题&#xff1a; 如果只执行make&#xff0c;它执行的是Makefile里哪一段语句呢&#xff1f; 怎么知道我的可执行程序是最新的呢&#xff1f; Makefile编译多个文件 进度条小程序 Makefile Makefile的介绍 …
阅读更多...
Acwing.860 染色法判定二分图(二分图染色法)

Acwing.860 染色法判定二分图(二分图染色法)

题目 给定一个n个点m条边的无向图&#xff0c;图中可能存在重边和自环。 请你判断这个图是否是二分图。 输入格式 第一行包含两个整数n和m。 接下来m行&#xff0c;每行包含两个整数u和v&#xff0c;表示点u和点v之间存在一条边。 输出格式 如果给定图是二分图&#xff0c…
阅读更多...
openpnp - 汇川 Inovance IS620PS2R8I-IAB-C的参数读取

openpnp - 汇川 Inovance IS620PS2R8I-IAB-C的参数读取

文章目录 openpnp - 汇川 Inovance IS620PS2R8I-IAB-C的参数读取概述笔记伺服和配套电机型号官方伺服调试软件笔记H00H01H02H03H04H05H06H07H08H09H0AH0BH0CH0DH0FH11H12H16H17H30H31自定义组备注END openpnp - 汇川 Inovance IS620PS2R8I-IAB-C的参数读取 概述 设备中用到了…
阅读更多...
Enterprise：使用 MySQL connector 同步 MySQL 数据到 Elasticsearch

Enterprise：使用 MySQL connector 同步 MySQL 数据到 Elasticsearch

Elastic MySQL 连接器是 MySQL 数据源的连接器。它可以帮我们把 MySQL 里的数据同步到 Elasticsearch 中去。在今天的文章里&#xff0c;我来详细地描述如何一步一步地实现。 在下面的展示中&#xff0c;我将使用 Elastic Stack 8.8.2 来进行展示。 无缝集成&#xff1a;将 Ela…
阅读更多...
两只小企鹅（Python实现）

两只小企鹅（Python实现）

目录 1 和她浪漫的昨天 2 未来的旖旎风景 3 Python完整代码 1 和她浪漫的昨天 是的,春天需要你。经常会有一颗星等着你抬头去看&#xff1b; 和她一起吹晚风吗﹖在春天的柏油路夏日的桥头秋季的公园寒冬的阳台&#xff1b; 这世界不停开花&#xff0c;我想放进你心里一朵&#…
阅读更多...
docker 里面各种 command not found 总结

docker 里面各种 command not found 总结

一、ip&#xff1a;command not found 执行命令&#xff1a; apt-get update & apt-get install -y iproute2 二、yum&#xff1a;command not found 执行命令&#xff1a; apt-get update & apt-get install -y yum 三、ping&#xff1a;command not found 执行命…
阅读更多...
113、基于51单片机的智能电子密码锁控制系统设计(程序+原理图+PCB源文件+Proteus仿真+参考论文+开题报告+设计资料+焊接指导书+元器件清单等)

113、基于51单片机的智能电子密码锁控制系统设计(程序+原理图+PCB源文件+Proteus仿真+参考论文+开题报告+设计资料+焊接指导书+元器件清单等)

摘 要 在日常的生活和工作中, 住宅与部门的安全防范、单位的文件档案、财务报表以及一些个人资料的保存多以加锁的办法来解决。具有防盗报警等功能的电子密码锁代替密码量少、安全性差的机械式密码锁已是必然趋势。随着科学技术的不断发展&#xff0c;人们对日常生活中的安全保…
阅读更多...
多元融合：流媒体传输网络的全盘解法

多元融合：流媒体传输网络的全盘解法

我们在寻找「网络」的全盘解法。 音视频数字化在消费领域的红利俨然见顶&#xff0c;而产业级视频应用激活了更多场景下的业务模式。与此同时&#xff0c;音视频客户也从单一的业务需求&#xff0c;趋向于多种业务并行存在的需求。 固有的网络能满足新兴的业态吗&#xff1f;延…
阅读更多...
帧同步实现PuppetMaster布娃娃系统的问题

帧同步实现PuppetMaster布娃娃系统的问题

1&#xff09;帧同步实现PuppetMaster布娃娃系统的问题 ​2&#xff09;如何屏蔽Unity打包在IQOO安卓手机上出现一侧是黑边的现象 3&#xff09;SLG或者策略游戏的联盟边界线是如何实现的 这是第343篇UWA技术知识分享的推送&#xff0c;精选了UWA社区的热门话题&#xff0c;涵盖…
阅读更多...
Acwing算法基础 前缀和与差分

Acwing算法基础 前缀和与差分

前缀和与差分 AcWing 795. 前缀和 import java.util.*; public class Main{public static void main(String[] args ){Scanner scnew Scanner(System.in);int nsc.nextInt();int msc.nextInt();int[] arrnew int[n1];arr[0]0;for(int i1;i<n;i) {arr[i]sc.nextInt()arr[i-1…
阅读更多...
基于Java+Swing实现表白墙的效果

基于Java+Swing实现表白墙的效果

JavaSwingmysql员工工资管理系统 一、系统介绍二、功能展示1.效果展示 三、系统实现1.salary.java 四、其它系统五、获取源码 一、系统介绍 使用javaswing桌面编程技术实现的一个表白墙的效果 二、功能展示 1.效果展示 基于javaswing表白墙的效果 三、系统实现 1.salary.ja…
阅读更多...
Python实现AdaBoost回归模型(AdaBoostRegressor算法)并应用网格搜索算法调优项目实战

Python实现AdaBoost回归模型(AdaBoostRegressor算法)并应用网格搜索算法调优项目实战

说明&#xff1a;这是一个机器学习实战项目&#xff08;附带数据代码文档代码讲解&#xff09;&#xff0c;如需数据代码文档代码讲解可以直接到文章最后获取。 1.项目背景 AdaBoost算法&#xff08;Adaptive Boosting&#xff09;是一种有效而实用的Boosting算法&#xff0c;…
阅读更多...
C++ | 反向迭代器

C++ | 反向迭代器

目录 前言 一、基本框架 二、起始位置和结束位置 三、反向迭代器的自增与自减 四、反向迭代器的判断 五、list类的修改 六、单独设计反向迭代器类的意义 前言 反向迭代器实际上与我们前面的stack、queue、priority一样&#xff0c;都是适配器&#xff1b;我们可以通过正向…
阅读更多...
国网技术学院MySQL课堂练习

国网技术学院MySQL课堂练习

一、数据库的安装和配置 在虚拟机中安装WINDOWS7操作系统 正常安装&#xff0c;查询安装教程即可安装必备组件和MYSQL5.7数据库 正常安装&#xff0c;查询安装教程即可修改my.ini配置文件中关于character_set的相关设置 直接补下面的代码即可&#xff0c;作用为设置默认的内…
阅读更多...
Hudi基础知识讲解

Hudi基础知识讲解

Hudi概述 Hudi是一种数据湖的存储格式&#xff0c;在Hadoop文件系统之上提供了更新数据和删除数据的能力以及消费变化数据的能力。支持多种计算引擎&#xff0c;提供IUD接口&#xff0c;在 HDFS的数据集上提供了插入更新和增量拉取的流原语。 基础架构图 Hudi特性 ACID事务能…
阅读更多...
将一个数组对象里的属性值全部追加到另外一个数组的对象里

将一个数组对象里的属性值全部追加到另外一个数组的对象里

介绍 将一个数组对象里的属性值全部追加到另外一个数组的对象里&#xff0c;这里需要使用到 map 遍历&#xff0c;循环数组&#xff0c;依次处理元素&#xff0c;实现重组数组对象 tips&#xff1a; map() 不会对空数组进行检测。 map() 不会改变原始数组。 Object.assign(),…
阅读更多...
推荐文章
最新文章

Copyright @ 2022~2023