Skip to first unread message
przem...@gmail.com
Oct 10, 2015, 6:58:04 PM10/10/15
to Polymer
Hi
I started lerning polymer, and I wrote first example app.
index.html
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript" src="bower_components/webcomponentsjs/webcomponents.js"></script>
<link rel="import" href="http://localhost:8000/elements/hello-world.html" />
</head>
<body>
<hello-world></hello-world>
</body>
</html>
elements/hello-world.html
<link rel="import" href="http://localhost:8000/bower_components/polymer/polymer.html" />
<polymer-element name="hello-world" noscript>
<template>
<h1>Hello World</h1>
</template>
</polymer-element>
Console show problem:
webcomponents.js:1 Uncaught SyntaxError: Unexpected token <
I don't know where is problem.
Rubén Díaz Martínez
Oct 11, 2015, 8:08:29 AM10/11/15
to Polymer, przem...@gmail.com
Hi. First of all I think you are using an old version of polymer, since in the examples from polymer-project.org it says that you define your elements with dom-element instead of polymer-element
przem...@gmail.com
Oct 11, 2015, 9:24:53 AM10/11/15
to Polymer, przem...@gmail.com
I update my file
elements/hello-world.html to
<link rel="import" href="http://localhost:8000/bower_components/polymer/polymer.html" />
<dom-element id="hello-world">
<template>
<p>I'm a DOM element. This is my local DOM!</p>
</template>
<script>
Polymer({
is: "hello-world"
});
</script>
</dom-element>
Unfortunately the problem didn't resolve.
Rubén Díaz Martínez
Oct 11, 2015, 12:23:05 PM10/11/15
to Polymer, przem...@gmail.com
Sorry, my fault. The name of the tag should be dom-module. I tried it myself and it works.
BTW, you don't need to specify the href and src with localhost:8080, just put the relative path :)
przem...@gmail.com
Oct 11, 2015, 3:45:53 PM10/11/15
to Polymer, przem...@gmail.com
I forgot add that I run it on node.js. When my paths was relative the problem generated repeatedly. I capture the photo.
Max
Oct 11, 2015, 4:23:01 PM10/11/15
to przem...@gmail.com, Polymer
That seems to be suggesting that your file is called webcomponents.js (see the tab at the top of the debugger, and the error is on the first line, which starts with a '<' which isn't valid javascript), but it contains html. Rename the file to index.html instead and see what it does then.
Max.
Follow Polymer on Google+: plus.google.com/107187849809354688692
---
You received this message because you are subscribed to the Google Groups "Polymer" group.
To unsubscribe from this group and stop receiving emails from it, send an email to polymer-dev...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/polymer-dev/9c2dc78b-f128-41f2-8369-f5117b38933a%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.
przem...@gmail.com
Oct 12, 2015, 4:45:52 PM10/12/15
to Polymer, przem...@gmail.com
I have file index.html, the code is in my first post. I clicked on error in console and it this code appear in tab. It is very strange for me.
Message has been deleted
Max
Oct 16, 2015, 1:52:54 PM10/16/15
to Rubén Díaz Martínez, Polymer, przem...@gmail.com
I find the mix of `src="bower_compoments/..."` and `href="http://localhost:8000/bower_components/..."` a bit odd. I'd recommend sticking with the former.
Like Rubén says, better to use Polymer 1.0+ version (`<polymer-element>` is Polymer 0.5 which has no future). Make sure `bower_components/polymer/polymer.html` is >1.0 - use `bower list`, which gives me polymer#1.1.5. It'd be worth making sure your webcomponents version is as you expected too (`bower list` will tell you that - should be 0.7.14, iinm) - and you probably just want the lite version; ie webcomponents-lite.min.js (it's in the same directory).
Like Rubén says, better to use Polymer 1.0+ version (`<polymer-element>` is Polymer 0.5 which has no future). Make sure `bower_components/polymer/polymer.html` is >1.0 - use `bower list`, which gives me polymer#1.1.5. It'd be worth making sure your webcomponents version is as you expected too (`bower list` will tell you that - should be 0.7.14, iinm) - and you probably just want the lite version; ie webcomponents-lite.min.js (it's in the same directory).
TBH, I would recommend you start learning by using the PST - <https://developers.google.com/web/tools/polymer-starter-kit/index?hl=en> - it'll have all these things correct from the beginning, so you can concentrate on the actual Polymer aspects instead of the tooling that surrounds it all.
HTH
Max.
Follow Polymer on Google+: plus.google.com/107187849809354688692
---
You received this message because you are subscribed to the Google Groups "Polymer" group.
To unsubscribe from this group and stop receiving emails from it, send an email to polymer-dev...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/polymer-dev/b769a3ae-6225-405e-bf2d-e9e2c742c2b3%40googlegroups.com.
Reply all
Reply to author
Forward
0 new messages