Question

我正在开发一个nuxt项目，并且我正在尝试使用Google地图和插件https://www.npmjs.com/package/vue2-google-maps构建地图组件。我已经使用npm安装了插件

在我的index.html页面中，我有一个正常工作的页面，看起来像：

<template>
   <div>

<br>
<br>
       <Card/>
<br>
<br>
<br>
<br>
       <!-- <Googlemap/> -->
       <Panel/>
       <Four/>
       </div> 
</template>

<script>

import Panel from '~/components/panel.vue'
import Card from '~/components/detailCard.vue'
// import GoogleMap from '~/components/googleMap.vue'


export default {

  components: {

    Panel,
    Card,
//     GoogleMap
  }

}
</script>

当我取消注释其中包含Googlemap的3行时，在屏幕截图中出现了错误。

Googlemap组件是：

<template>
  <GmapMap
  :center="{lat:10, lng:10}"
  :zoom="7"
  map-type-id="terrain"
  style="width: 500px; height: 300px"
>
  <GmapMarker
    :key="index"
    v-for="(m, index) in markers"
    :position="m.position"
    :clickable="true"
    :draggable="true"
    @click="center=m.position"
  />
</GmapMap>

</template>


<script>
import Vue from "vue";
import * as VueGoogleMaps from "vue2-google-maps";

Vue.use(VueGoogleMaps, {
  load: {
    key: "MYTOKEN",
    libraries: "places"
  }
});

export default {

}

</script>


<style>

</style>

我在做什么错了？

编辑：

Answer 1

通常，它指的是来自请求的响应，在此请求中是JSON对象，但返回的是HTML。 this.cy.on('wheel', event => { //somecodehere });指< ...或类似物中的第一个字符。

检查从您正在使用的API或其他服务返回的响应。

Answer 2

您很可能错过了转机

https://github.com/xkjyeah/vue-google-maps/blob/0985d475496083f2459db2960ba8f9317aab50ef/README.md#nuxtjs-config

transpile: [/^vue2-google-maps($|\/)/]

Nuxt：意外令牌<

2 个答案: