Vue.js Vuetify错误:未捕获的语法错误:意外的令牌导出

Vue.js Vuetify错误:未捕获的语法错误:意外的令牌导出,vue.js,Vue.js,我现在正在尝试使用vuetify,但我真的不知道如何使用它。我使用了CDN,并从vuetify.js复制粘贴了html和javascript代码,但根本不起作用。它返回错误未捕获语法错误:意外的令牌导出。 这是html代码: <template> <v-card height="200px"> <v-bottom-nav absolute shift value="true" :class="{

我现在正在尝试使用vuetify,但我真的不知道如何使用它。我使用了CDN,并从vuetify.js复制粘贴了html和javascript代码,但根本不起作用。它返回错误
未捕获语法错误:意外的令牌导出。
这是html代码:

<template>
  <v-card height="200px">
    <v-bottom-nav
      absolute
      shift
      value="true"
      :class="{
        'blue-grey': e2 === 1,
        'teal': e2 === 2,
        'brown': e2 === 3,
        'brown lighten-1': e2 === 4
      }"
    >
      <v-btn dark @click.native="e2 = 1" :value="e2 === 1">
        <span>Video</span>
        <v-icon>ondemand_video</v-icon>
      </v-btn>
      <v-btn dark @click.native="e2 = 2" :value="e2 === 2">
        <span>Music</span>
        <v-icon>music_note</v-icon>
      </v-btn>
      <v-btn dark @click.native="e2 = 3" :value="e2 === 3">
        <span>Book</span>
        <v-icon>book</v-icon>
      </v-btn>
      <v-btn dark @click.native="e2 = 4" :value="e2 === 4">
        <span>Image</span>
        <v-icon>image</v-icon>
      </v-btn>
    </v-bottom-nav>
  </v-card>
</template>

and javascript code:
<script>
  export default {
    data () {
      return {
        e2: 3
      }
    }
  }
</script>

视频
ondemand_视频
音乐
音符
书
书
形象
形象
和javascript代码:
导出默认值{
数据(){
返回{
e2:3
}
}
}

Vuetify现在在上有一个CDN快速启动。我建议您进行设置,然后您应该能够复制并粘贴文档示例中的代码。

在我的例子中,我重新运行
npm run serve
并在加载Vuetify默认页面之前刷新浏览器,没有任何错误。

您说您已经复制并粘贴了该代码-您将其粘贴到了哪里?这是一个单一的文件组件,它需要使用webpack和vue loader将构建设置转换为浏览器可以理解的javascript版本…实际上我不知道如何使用vuetify。我假设vuetify和materialize/bootstrap可以以相同的方式使用。我只制作了一个html文件,然后将粘贴CDN、其js和html代码复制到这个html文件中。你能帮我如何使用vuetify吗@利努斯堡