如何下载js类库
https://bower.io/ 这个已经淘汰
https://learn.jquery.com/jquery-ui/environments/bower/
Web sites are made of lots of things — frameworks, libraries, assets, and utilities. Bower manages all these things for you.
Keeping track of all these packages and making sure they are up to date (or set to the specific versions you need) is tricky. Bower to the rescue!
Bower can manage components that contain HTML, CSS, JavaScript, fonts or even image files. Bower doesn’t concatenate or minify code or do anything else - it just installs the right versions of the packages you need and their dependencies.
To get started, Bower works by fetching and installing packages from all over, taking care of hunting, finding, downloading, and saving the stuff you’re looking for. Bower keeps track of these packages in a manifest file, bower.json. How you use packages is up to you. Bower provides hooks to facilitate using packages in your tools and workflows.
Bower is optimized for the front-end. If multiple packages depend on a package - jQuery for example - Bower will download jQuery just once. This is known as a flat dependency graph and it helps reduce page load.
Install Bower
Bower is a command line utility. Install it with npm.
npm install -g bower
Bower requires node, npm and git.
Latest release:
For troubleshooting installation on different platforms, read the troubleshooting wiki page.
Getting started
Install packages
Install packages with bower install. Bower installs packages to bower_components/.
bower install <package>
A package can be a GitHub shorthand, a Git endpoint, a URL, and more. Read more about bower install.
# installs the project dependencies listed in bower.json
bower install
# registered package
bower install jquery
# GitHub shorthand
bower install desandro/masonry
# Git endpoint
bower install git://github.com/user/package.git
# URL
bower install http://example.com/script.js
Search packages
Search Bower packages and find the registered package names for your favorite projects.
Save packages
Create a bower.json file for your package with bower init.
Then save new dependencies to your bower.json with bower install PACKAGE --save
Use packages
How you use packages is up to you. We recommend you use Bower together with Grunt, RequireJS, Yeoman, and lots of other tools or build your own workflow with the API. You can also use the installed packages directly, like this, in the case of jquery:
<script src="bower_components/jquery/dist/jquery.min.js"></script>
实例
https://libraries.io/bower/blueimp-file-upload
bower install blueimp-file-upload
安装完成后可以查看版本
https://stedolan.github.io/jq/
https://shapeshed.com/jq-json/#how-to-find-a-key-and-value
https://github.com/stedolan/jq/wiki/Installation#windows-with-choco
cat bower_components/blueimp-file-upload/.bower.json | ./jq-win64.exe '.version'
"9.32.0"
npm
https://www.npmjs.com/package/blueimp-file-upload
npm i blueimp-file-upload
Bye, bye, Bower! Or how to migrate from Bower to npm and Webpack
Bower is going away. Even the bower team is recommending developers to move over to npm (or Yarn which I personally prefer) and Webpack. As one can see from the screenshot, we get the following warning when running npm i bower from cli.

Difference between Grunt, NPM and Bower ( package.json vs bower.json )
Update for mid 2016:
The things are changing so fast that if it's late 2017 this answer might not be up to date anymore!
Beginners can quickly get lost in choice of build tools and workflows, but what's most up to date in 2016 is not using Bower, Grunt or Gulp at all! With help of Webpack you can do everything directly in NPM!
Google "npm as build tool" result: https://medium.com/@dabit3/introduction-to-using-npm-as-a-build-tool-b41076f488b0#.c33e74tsa
Don't get me wrong people use other workflows and I still use GULP in my legacy project(but slowly moving out of it), but this is how it's done in the best companies and developers working in this workflow make a LOT of money!
Look at this template it's a very up-to-date setup consisting of a mixture of the best and the latest technologies: https://github.com/coryhouse/react-slingshot
- Webpack
- NPM as a build tool (no Gulp, Grunt or Bower)
- React with Redux
- ESLint
- the list is long. Go and explore!
Your questions:
When I want to add a package (and check in the dependency into git), where does it belong - into package.json or into bower.json
Everything belongs in package.json now
Dependencies required for build are in "devDependencies" i.e.
npm install require-dir --save-dev(--save-dev updates your package.json by adding an entry to devDependencies)- Dependencies required for your application during runtime are in "dependencies" i.e.
npm install lodash --save(--save updates your package.json by adding an entry to dependencies)
If that is the case, when should I ever install packages explicitly like that without adding them to the file that manages dependencies (apart from installing command line tools globally)?
Always. Just because of comfort. When you add a flag (--save-dev or --save) the file that manages deps (package.json) gets updated automatically. Don't waste time by editing dependencies in it manually. Shortcut for npm install --save-dev package-name is npm i -D package-name and shortcut for npm install --save package-name is npm i -S package-name
如何下载js类库的更多相关文章
- 基于js-spark-md5前端js类库,快速获取文件Md5值
js-spark-md5是歪果仁开发的东西,有点多,但是我们只要一个js文件即可,具体类包我存在自己的oschina上,下载地址:https://git.oschina.net/jianqingwan ...
- php大力力 [029节] 做PHP项目如何下载js文件:使用腾讯浏览器把网上案例页面存储到本地
php大力力 [029节] 做PHP项目如何下载js文件:使用腾讯浏览器把网上案例页面存储到本地 yeah,搞定啦 php大力力 [029节] 做PHP项目如何下载js文件:使用腾讯浏览器把网上案例页 ...
- php大力力 [028节] 如何下载js文件,网上一个*.js无法下载啊??????
php大力力 [028节] 如何下载js文件,网上一个*.js无法下载啊?????? safari也无法下载 迅雷也无法下载 是不是对方网站服务器的不让下载那个js目录的文件??? 只能调用js函数啊 ...
- 简单轻量级的一套JS 类库(RapidDevelopmentFramework.JS)
1.最近好久没有更新自己的博客了,一直在考虑自己应该写一些什么.4.2日从苏州回到南京的路上感觉自己的内心些崩溃和失落,我就不多说了? 猛然之间我认为自己需要找一下内心的平衡.决定开发属于自己一套快速 ...
- 封装的一套简单轻量级JS 类库(RapidDevelopmentFramework.JS)
1.最近好久没有更新自己的博客了,一直在考虑自己应该写一些什么.4.2日从苏州回到南京的路上感觉自己的内心些崩溃和失落,我就不多说了? 猛然之间我认为自己需要找一下内心的平衡.决定开发属于自己一套快速 ...
- 【js类库AngularJs】学习angularJs的指令(包括常见表单验证,隐藏等功能)
[js类库AngularJs]学习angularJs的指令(包括常见表单验证,隐藏等功能) AngularJS诞生于2009年,由Misko Hevery 等人创建,后为Google所收购.是一款优秀 ...
- 【js类库AngularJs】解决angular+springmvc的post提交问题
[js类库AngularJs]解决angular+springmvc的post提交问题 AngularJS诞生于2009年,由Misko Hevery 等人创建,后为Google所收购.是一款优秀的前 ...
- 如何在TypeScript中使用JS类库
使用流程 1.首先要清除类库是什么类型,不同的类库有不同的使用方式 2.寻找声明文件 JS类库一般有三类:全局类库.模块类库.UMD库.例如,jQuery是一种UMD库,既可以通过全局方式来引用,也可 ...
- 前端UI框架和JS类库
一.前端框架库: 1.Zepto.js 地址:http://www.css88.com/doc/zeptojs/ 描述:Zepto是一个轻量级的针对现代高级浏览器的JavaScript库, 它与jqu ...
随机推荐
- Mac下安装rJava,xlsx,ReporteRs包
xlsx包可以用来读取excel数据,ReporteRs包可以用来直接输出word报告,这两个包都对rJava包有依赖,所以必须先安装rJava. (1)查看mac的java信息 java版本: &g ...
- CF1088F Ehab and a weird weight formula【倍增】
首先把点权归到边上,设点权较小的一个点是v,也就是(u,v)的边权是log2(dis(u,v))*a[v]+a[v]+a[u] 然后还有一个性质就是这棵树按点权最小点提起来就是一个堆 暴力是n^2的M ...
- 「GXOI / GZOI2019」逼死强迫症——斐波那契+矩阵快速幂
题目 [题目描述] ITX351 要铺一条 $2 \times N$ 的路,为此他购买了 $N$ 块 $2 \times 1$ 的方砖.可是其中一块砖在运送的过程中从中间裂开了,变成了两块 $1 \t ...
- 洛谷P4004 Hello world!(分块+并查集)
传送门 虽然洛谷数据水,然而咱最终还是没有卡过uoj上的毒瘤数据-- 神tm全uoj就3个人过了这题-- 首先,每个数最多被开根\(6\)次,开到\(1\)之后就别管它了,把它用并查集连到它父亲上 它 ...
- 启动Eclipse时,出现 “Failed to load the JNI shared library "C:\Program Files\java\jdk1.7.....\jvm.dll"
原因1:给定目录下jvm.dll不存在. 解决方法:(1)重新安装jre或者jdk并配置好环境变量. (2)copy一个jvm.dll放在该目录下. 原因2:eclipse的版本与jre或者jdk版本 ...
- JS高级学习历程-8
2 构造函数和普通函数的区别 两者本身没有实质区别,具体看使用 new 函数(); -------->构造函数 函数(); ---------> 普通函数 <!D ...
- 微信小程序入门文档
一 基本介绍 微信专门为小程序开发了一个ide叫做微信开发者工具 最新一版的微信开发者工具,把微信公众号的调试开发工作也集成了进去,可以更换开发模式. https://mp.weixin.qq.com ...
- C# 数组之ArrayList
一.引言 ArrayList类相当于一种高级的动态数组,是Array类的升级版本. 一般的Array,底层是数组实现的,对于数据的查找和修改十分高效.但是有2个大的缺点,其一为增删低效,其二为数组长度 ...
- 老男孩IT教育-每日一题汇总
老男孩IT教育-每日一题汇总 第几天 第几周 日期 快速访问链接 第123天 第二十五周 2017年8月25日 出现Swap file….already exists以下错误如何解决? 第122天 2 ...
- ruby 从命令行读取文本
最常见的方式就是使用内置的get 方法,这个方法可以从命令行读取用户的输入,并在默认的情况下把读入的文本赋值给预定义变量$_. 但是get方法会保留用户在输入字符串末尾所加的换行符,当用户在输入的字符 ...