1: I installed expressjs. 2: I installed the vue framework using npm install vue --save 3: I used the steering wheel as a template engine for expressjs
After that, in index.hbs, this is the code:
<h1>{{title}}</h1>
<p>Welcome to {{title}}</p>
<p>\{{title2}}</p>
<script>
new Vue({
el: "#app",
data: {
title2: "Hello World"
}
});
</script>
Now I wanted to use vue to execute this script but things in layout.hbs, I tried, but don’t know how to enable vue, so I just added vue from cdnjs.
There was also a problem, I added that the head cannot be included at the end of the body, because the hbs visualization template does not execute the script.
Now secondly, when I want to use vue in users.hbs, I need to create a Vue Instance again, and this will continue with more accessible pages.
It repeats the code and is very difficult to manage.
- ? , script cdn?
, Vue app.js, :
[Vue warn]: You are using the runtime-only build of Vue where the template compiler is not available. Either pre-compile the templates into render functions, or use the compiler-included build.
(found in <Root>)
layout.hbs
<!DOCTYPE html>
<html>
<head>
<title>{{title}}</title>
<link rel='stylesheet' href='/stylesheets/style.css' />
<script src="https://cdnjs.cloudflare.com/ajax/libs/vue/2.2.2/vue.min.js"></script>
</head>
<body>
<div id="app">
{{{body}}}
</div>
</body>
</html>