Error: Templates should only be responsible for mapping the state to the UI. Avoid placing tags with side-effects in your templates, such as <script>
You can use script tag in this way and it will work fine.I was facing the same problem when I used <script></script>
tag without specifying its type.After using the type attribute Vue did not warn me for critical error:
<script type="application/javascript"> // your code</script>
I think the answer is in you question title. Just get rid of all the <script>
tags in the template, put them outside of the template.
In this case you are using body
as the template and you are putting scripts inside your template (body
)
The easy solution is to change the el: 'body'
to el: '#wrapper'
and edit your html to
<body><div id="wrapper">...</div><script ... ><script ... ></body>
Make sure you have a closing tag on your root element.I just spent the last 6 hours systematically removing things and pulling my hair out. Turns out I had deleted my closing at some point and Vue was interpreting