InfoHeap
Tech
Navigation
  • Home
  • Tutorials
    • CSS tutorials & examples
    • CSS properties
    • Javascript cookbook
    • Linux/Unix Command Line
    • Mac
    • PHP
      • PHP functions online
      • PHP regex
    • WordPress
  • Online Tools
    • Text utilities
    • Online Lint Tools
search

Web components and Polymer

  • HTML import
  • polymer installation
  • HTML5 shadow dom
  • custom tag
 
  • Home
  • > Tutorials
  • > Web Development
  • > Web components

How to install polymer

on Feb 27, 2016

Polymer can be installed on Linux (or Mac) using bower on command line. It generates web component and polymer javascript files which can be included in your polymer project. Note that using polyfills, polymer works on almost all browsers.

Steps to install polymer:

  1. First install bower if not installed already.
  2. Create a directory my_polymer_test_project and cd to it. Then run the bower init command

    $ bower init  ## Keep defaults for the purpose of this tutorial
    $ cat bower.json
    {
      "name": "my_polymer_test_project",
      "authors": [
        "testauthor"
      ],
      "description": "",
      "main": "",
      "moduleType": [],
      "license": "MIT",
      "homepage": "",
      "ignore": [
        "**/.*",
        "node_modules",
        "bower_components",
        "test",
        "tests"
      ]
    }
    
  3. Install polymer and save dependencies in bower.json

    $ bower install polymer --save
    polymer#1.3.0 bower_components/polymer
    └── webcomponentsjs#0.7.21
    
    webcomponentsjs#0.7.21 bower_components/webcomponentsjs
    $ ls -p bower_components/
    polymer/		webcomponentsjs/
    

    Not that it has also installed webcomponentsjs as polymer is dependent on it.

  4. View the bower.json again

    $ cat bower.json
    ...
    ...
      "dependencies": {
        "polymer": "^1.3.0"
      }
    }
    
  5. To include webcomponentsjs javascript files, regular script tag can be used. To include polymer html files the following code snippet can be used.
    <link rel="import" href="bower_components/polymer/polymer.html">
    Note that import have to be done either from same domain or Cross domain request need to be allowed from the domain serving polymer files.

Suggested posts:

  1. How to install casperjs on Ubuntu Linux
  2. HTML import
  3. CSS max-width – limit maximum wodth of an element
  4. Php look ahead and look behind regex examples
  5. How to install node (node.js) on Mac
  6. Mac brew – how to find latest available package without installing
  7. jQuery – find total number of DOM elements
  8. bower – installation and quick start guide
Share this article: share on facebook share on linkedin tweet this submit to reddit
Posted in Tutorials | Tagged Tutorials, Web components
  • Browse content
  • Article Topics
  • Article archives
  • Contact Us
Popular Topics: Android Development | AngularJS | Apache | AWS and EC2 | Bash shell scripting | Chrome developer tools | Company results | CSS | CSS cookbook | CSS properties | CSS Pseudo Classes | CSS selectors | CSS3 | CSS3 flexbox | Devops | Git | HTML | HTML5 | Java | Javascript | Javascript cookbook | Javascript DOM | jQuery | Kubernetes | Linux | Linux/Unix Command Line | Mac | Mac Command Line | Mysql | Networking | Node.js | Online Tools | PHP | PHP cookbook | PHP Regex | Python | Python array | Python cookbook | SEO | Site Performance | SSH | Ubuntu Linux | Web Development | Webmaster | Wordpress | Wordpress customization | Wordpress How To | Wordpress Mysql Queries | InfoHeap Money

Copyright © 2025 InfoHeap.

Powered by WordPress