I love the simplicity of Vue.js, but I don't want to complexify it with browserify or webpack. I prefer something like templateUrl in Angular, so I can serve the partial page(usually a component) with Nginx directly. How could I set up this? It's not suggested officially, hard to get help there.
1 Answer
Vue doesn't have anything built in for this specifically as far as I can tell but you'd be able to use async components to fake it if you wanted to.
Vue.component('example', function (resolve, reject) {
$.get('templates/example.html').done(function (template) {
resolve({
template: template
})
});
});
You'd also be able to do something like this as well in your HTML.
<div id="app"></div>
<template id="example">
<div>
<h1>{{ message }}</h1>
</div>
</template>
Then you can do like:
new Vue({
el: '#app',
components: {
example: {
template: '#example',
data: function () {
return {
message: 'Yo'
}
}
}
}
});
Though, I think taking the time to get comfortable with browserify or webpack is well worth the investment. Especially because you can use vueify.
3 Comments
rashidnk
sorry newbie, is this vuejs1 or 2 ? $ is of vuejs ?
Bill Criswell
The $ is jQuery. So, just using jQuery's
get as an example.Bill Criswell
of an async request. You can use whatever you'd want.