如何讓茉莉花讀取單個文件的Vue組件？

Question

所以我通過npm安裝了jasmine和vue，但是當我導入組件本身，它是一個.vue文件時，它無法讀取模板，它位於<template></template>標籤之間。我也在使用webpack，並不確定是否需要對此做些什麼。

這裏有一個VUE組件文件的樣子

<template> 
    ... 
</template> 

<script> 
    export default { 
    name: 'test', 
    data: {}, 
    computed: {} 
    } 
</script> 

Answer 1

您需要使用vue-cli和webpack template開始建立你的Vue公司的應用程序。

如果你只是開始使用Vue.js，我建議你去Vue.js的standalone version，這是一個簡單的JavaScript文件，你可以使用腳本標籤包含，然後開始使用組件和模板。

一旦您習慣了創建各種組件和定義模板的想法，您可以從vue-cli和webpack template開始構建複雜的應用程序。

Answer 2

.vue文件需要被編譯，如果你正在使用webpack，那麼你需要使用vue-loader到你的模板轉化爲plain javascript，內部vue-loader將採取所有的代碼模板標記之間，並將其轉換爲render functions。你應該先看看single file components的文檔，然後從那裏開始。