CODEWITHSUNDEEP
vue.jsvuejs2vue-component
sazr
sazr

Reputation: 25928

Vue Component with external template and style?

Can I have a Vue component where the template is found in an external file (.html)? Can we do the same with the style (.scss)?

This will assist our development where we can have front-end HTML devs work on the HTML and styling and the javascript devs can work on the component logic and behavior.

Is it possible to reference/import a template and style in a vue component?

Upvotes: 2

Views: 5410

Answers (1)

oniondomes
oniondomes

Reputation: 2063

The answer is yes, but the entry for you component would contain a template, not a script. From Single File Components section of Vue.js docs:

Even if you don’t like the idea of Single-File Components, you can still leverage its hot-reloading and pre-compilation features by separating your JavaScript and CSS into separate files:

<!-- my-component.vue -->
<template>
    <div>This will be pre-compiled</div>
</template>
<script src="./my-component.js"></script>
<style src="./my-component.css"></style>

Upvotes: 6

Related Questions