how to deploy polymer-starter-kit on tomcat

1.4k views Asked by At

I have installed all required packages for polymer.

I downloaded polymer-starter-kit and build it.

If I start polymer serve, I can get the page similar like following:

enter image description here

However, if I copy the folder /build/bundled under my polymer app directory, to the place /path/to/tomcat/webapps, the page I get is only grep background, nothing more.

enter image description here

I would like to know how to properly deploy a polymer app on tomcat.

If I just build a very very simple polymer with only one element instead of the polymer-starter-kit, after copying the /build/bundled into /path/to/tomcat/webapps, the page can be shown properly.

enter image description here

3

There are 3 answers

0
fluency03 On BEST ANSWER

Thanks for ynov's answer. It helps and works. But it is not so elegant.


Another workaround is stated here regarding Deploying my application at the root in Tomcat: configure the context root in conf/server.xml to use your app:

<Context path="" docBase="polymer" debug="0" reloadable="true"></Context>

However, as stated in the Apache Tomcat 7 Configuration Reference - The Context Container:

It is NOT recommended to place elements directly in the server.xml file. This is because it makes modifying the Context configuration more invasive since the main conf/server.xml file cannot be reloaded without restarting Tomcat.


The actual problem of polymer-starter-kit cannot be properly deployed as a webapp on Tomcat is remained in the polymer-starter-kit source code. The website is not shown properly is because the resources (htmls, images, components, etc...) are not refered correctly.

In the originall code of polymer-starter-kit/index.html, the resources are linked like the following:

...

<!-- Homescreen icons -->
<link rel="apple-touch-icon" href="/images/manifest/icon-48x48.png">
<link rel="apple-touch-icon" sizes="72x72" href="/images/manifest/icon-72x72.png">
<link rel="apple-touch-icon" sizes="96x96" href="/images/manifest/icon-96x96.png">
<link rel="apple-touch-icon" sizes="144x144" href="/images/manifest/icon-144x144.png">
<link rel="apple-touch-icon" sizes="192x192" href="/images/manifest/icon-192x192.png">

...

However, if you deploy the webapp in a sub directory $TOMCAT/webapps/ like $TOMCAT/webapps/polymer, the link reference like href="/images/manifest/icon-48x48.png" won't work, because it refers to the root directory. This is why the previous workarounds (i.e., put the webapp at $TOMCAT/webapps/ROOT) work. So, the trick is change the link to href="images/manifest/icon-48x48.png" (or any other proper path suitable to the correct path of the resources you want ot use.).

For example, in polymer-starter-kit/index.html:

...

<!-- Homescreen icons -->
<link rel="apple-touch-icon" href="images/manifest/icon-48x48.png">
<link rel="apple-touch-icon" sizes="72x72" href="images/manifest/icon-72x72.png">
<link rel="apple-touch-icon" sizes="96x96" href="images/manifest/icon-96x96.png">
<link rel="apple-touch-icon" sizes="144x144" href="images/manifest/icon-144x144.png">
<link rel="apple-touch-icon" sizes="192x192" href="images/manifest/icon-192x192.png">

...

because images/ and index.html are under same directory.

3
ynov On

I was able to deploy the polymer starter-kit app to Tomcat under ROOT context so that all dependencies can be resolved against it successfully.

Just run polymer build and copy the contents of \build\bundled folder under %TOMCAT_HOME%\webapps\ROOT, then start Tomcat and it should work.

1
Andy Weaver On

As for the Polymer Issues

Configuring Polymer to work properly on these Java Servlet based web servers can sometimes be kind of tricky. For starters open up dev tools to see what kind of errors you are receiving, likely you'll see some failed imports that shouldn't be overly difficult to resolve.

This is a drawback of using a servlet container to manage a non-servlet based application. Don't be discouraged it can be done, we have several apps in production on Tomcat servers.

You will likely have to throw polymer serve out the window for this project and setup a local Tomcat server to do your development on. As these behave completely differently.

Things to Keep in Mind

Not sure what your overall goal for the project is or how much availability you have to make adjustments to the Tomcat environment (which I assume would be a production goal.) You will want to use hash based routing straight from the beginning. These servlet containers are going to be looking for Java classes to handle URL(s).