[精讚] [會員登入]
1567

安裝網頁套件管理程式 Bower

一個非常棒的Javascript套件管理程式bower,用完愛不釋手。

分享此文連結 http://n.sfs.tw/10314

分享連結 安裝網頁套件管理程式 Bower@新精讚
(文章歡迎轉載,務必尊重版權註明連結來源)
2019-10-25 07:16:03 最後編修
2016-11-28 10:41:02 By 張○○
 

自動目錄

Bower[1]是我這近才知道的東西,因為我要安裝jquery時,他提供了一個bower的安裝方式,疑?這是什麼。所以我心不甘情不願的試試了。

Bower的logo是一隻彩色鳥,但是為什麼叫bower?我查bower的字義是臥室、樹蔭、村舍、船首錨,好的,沒有鳥。原來這字來自 bowerbird,官網有提到,這是twitter在2012年的teamwork,主要整合js、css fw等物件

我真的太久沒學習新的東西了,這是2012年就釋出的東西,好的,悲嘆3秒就夠了,懶惰學習是天性啊。

OS

CentOS release 6.5 (Final)

一、前言

要安裝Bower首先要有 npm,所以我快樂的使用npm要安裝Bower時,發現
# npm install -g bower
-bash: npm:命令找不到

接下來我想說用yum來裝應該就可以,但是失敗:
 yum -y install npm
...
No package npm available.
Error: Nothing to do

正常情況下這步我就會放棄用最爛的方法解決:睡覺去,可是今天我沒有。

參考[3]的解法,只要用下面的指令就能安裝:
yum -y install npm --enablerepo=epel

Error getting repository data for epel, repository not found

我又得到一個no epel的錯誤

二、先加入epel的repos.

EPEL(Extra Packages for Enterprise Linux)主要目的是提供各種企業級的 Linux 一些額外的高品質套件[2],依他的方法安裝:
# wget http://mirror01.idc.hinet.net/EPEL/6/i386/epel-release-6-8.noarch.rpm
# rpm -ivh epel-release-6-8.noarch.rpm

三、yum 安裝 npm

接下來就簡單了

# yum -y install npm --enablerepo=epel

四、用npm安裝Bower

# npm install -g bower

安裝完後,在/usr/bin/bower會有執行檔
# whereis bower
bower: /usr/bin/bower

五、用bower安裝jquery

用bower安裝jquery的好處就是,可以追踨版號和更新,詳細的使用可以參考[4][5]的說明,很詳細。

1. 建立bower設定檔 .bowerrc,假設javascript/jquery的套件都要裝在  js 這個目錄中

$ cd /path/to/web/js
$ touch .bowerrc
$ vi .bowerrc
{
    "directory" : "."
}

2. 安裝jquery

$ bower install jquery

bower cached        git://github.com/jquery/jquery.git#2.1.4
bower validate      2.1.4 against git://github.com/jquery/jquery.git#*
bower install       jquery#2.1.4

安裝完成後,就會在js的目錄下多出jqeury 目錄
├── js
│   └── jquery

六、bower 的操作筆記

1. 安裝
切到該目錄下
$ bower install package-name

安裝完會出現一個bower_components/ 的目錄,安裝後套件會放在裡面。

2. 使用root的權限安裝要加上 --allow-root 參數,否則會出現類似的錯誤:

bower ESUDO         Cannot be run with sudo

Additional error details:
Since bower is a user command, there is no need to execute it with superuser permissions.
If you're having permission errors when using bower without sudo, please spend a few minutes lear                   ning more about how your system should work and make any necessary repairs.

http://www.joyent.com/blog/installing-node-and-npm
https://gist.github.com/isaacs/579814

You can however run a command with sudo using --allow-root option

解決方法,加入-allow-root 參數,例:
#  bower  --allow-root install jquery

3. 要指定放置目錄,可以設定目錄路徑[5]

使用者家目錄 $HOME/.bowerrc 為全域設定。
專案根目錄 project/.bowerrc 為該專案本身的設定。

每個一個目都可以放置一個.bowerrc,建議為每個一目錄建立一個獨立的bowerrc,優點是獨立管理,例如我的web/目錄長這樣:
.
├── js
│   ├── .bowerrc
│   └── jquery
└── third
    ├── .bowerrc
    ├── pure-min.css
    └── pure-release-0.6.0

4. 移除套件

  切到胲目錄下
  $ bower uninstall package-name

  或刪掉套件的那個目錄

5. 更新套件

  切到胲目錄下
  $ bower update package-name

  或更新全部
  $ bower update

6.查看已安裝套件

  $ bower list

7. 尋找套件

  $ bower search jquery

錯誤排除

npm ERR! Error: SSL Error: CERT_UNTRUSTED

SSL沒有設定信任的憑證位置。可用兩種方法解決,一是略過,二是設定[6]

# npm config set strict-ssl false


# npm config set registry="http://registry.npmjs.org/"

結論

感覺bower還滿親善的,不會像composer一樣有點...巨大,用一用就會愛不釋手。

參考資料

[1] bower 官網 http://bower.io/
[2] EPEL http://blogger.gtwang.org/2013/10/redhat-linux-enable-epel-repo.html
[3] 大后端 http://www.dahouduan.com/2014/12/25/centos-yum-install-nodejs-npm/
[4] 小惡魔 Bower 管理網站套件的好工具
[5] EDEN TSAI Bower 前端套件管理工具
[6] http://stackoverflow.com/questions/21855035/ssl-error-cert-untrusted-while-using-npm-command

 

END

你可能感興趣的文章

[Centos6] php5.3升級為php5.6 Centos6 + php5.6 升級

使用mutt發信(LINUX直接寄信) mutt是一個簡易的發送程式,學會他就不用每次telnet mail server 煩死人

[Centos7] 安裝sphinx+php7 在centos7上安裝sphinx,在PHP7上運作正確

安裝網頁套件管理程式 Bower 一個非常棒的Javascript套件管理程式bower,用完愛不釋手。

安裝SPHINX支援中文 新版本的 sphinx 和舊版不同,網路上很多範例和教學是不能用的。此文是安裝和設定方法分享

[CentOS8] 1.安裝JULIA 安裝及開始使用 JULIA

[Centos8] PHP7.2升級到7.4 在centos8中把php 7.2升到7.4版

[CENTOS7] 使用 logrotate 來整理mongo日誌檔 解決 mongo 的日誌檔不斷長大的問題

Linux shell 的date表示法 linux下SHELL中的date表示法

[Centos7] 安裝phpMyAdmin Centos 7有新的方式可以安裝phpmyadmin,不必再採用過去的tarball安裝法。

我有話要說


限制:留言最高字數1000字,超過部分會被截掉。請注意:留言不可帶有網址,會被濾掉。 限制:未登入訪客,每則留言間隔需超過10分鐘,每日最多5則留言。

訪客留言

[無留言]

隨機好文

談借錢 人借錢時手心向上頭向下,人還錢時手心向下頭向上

[Windows7] 移除IE10及移除IE11 Windows7 不得已的情況要移除IE11或IE10怎麼做?

[CodeIgniter3] 解決無法上傳特定檔案(.sb2)的問題 上傳時出現The filetype you are attempting to upload is not allowed,要怎麼解決?

世紀帝國征服者新版本--被遺忘的帝國 世紀帝國征服者新版本--被遺忘的帝國 世紀二代的征服者是精典遊戲中的精典,aofe更好玩...

魔球中小女孩唱的歌 The show 魔球中小女孩唱的歌 The show