[Polymer] 安裝與使用

2014-06-14

4862
0
2014-07-07

摘要:Polymer 安裝與使用

起手式 - 安裝 Polymer

用 bower 裝 Polymer 最簡單，這裡略過 bower 安裝.

要用bower安裝 polymer ，可以參考這裡

http://www.polymer-project.org/docs/start/getting-the-code.html

安裝步驟

//先建個目錄

mkdir polymer

//bower初始化,也就是產生bower.json

bower init

//單純裝 Polymer 框架，不過沒元件可以用

bower install --save Polymer/polymer

//裝 Polymer 框架和核心元件

bower install --save Polymer/core-elements

//裝 Polymer 框架和Polymer的UI和非UI元件

bower install --save Polymer/polymer-elements Polymer/polymer-ui-elements

//裝完後應該像下面這樣，bower_components裡面就放polymer底層和所有元件

有坑! 貼心提示

bower 1.3.3重複裝 polymer 元件會有問題，現象是重複執行 bower install後停住不動，直到天荒地老。

所以記得要更新bower，經真人測試bower 1.3.5已經沒問題了，可以正常使用

參考連結

實際感受Polymer元件威力

新增 hello.html ，載入 platform.js 後，使用 google-map元件，就可以輕輕鬆鬆使用Google Map功能了.

程式碼

<!DOCTYPE html>
<html>
  <head>
    <script src="bower_components/platform/platform.js"></script>
  </head>
  <body>
<link rel="import" href="bower_components/google-map/google-map.html">
<style>
  google-map {
    display: block;
    height: 600px;
  }
</style>
<google-map latitude="22.605153" longitude="120.301125"
            disableDefaultUI showCenterMarker zoom="18"></google-map>
  </body>
</html>

顯示結果

回首頁