Question

我正在使用Vue 2.0，而我正在尝试集成vue-stripe模块。该模块将Stripe Checkout集成到Vue组件中。

我的应用程序打算让用户购买活动门票。我有一个index.js文件和一些组件。

我在index.js文件中执行此操作import { StripeCheckout } from 'vue-stripe'。然后，在Event Page Component（用户将使用Checkout表单）中，我这样做：

components: {
        'stripe-checkout': StripeCheckout
}

但是......这会引发以下错误：

SyntaxError: import declarations may only appear at top level of a module

发生了什么事？我究竟做错了什么？我怎样才能做到这一点？

这是index.js

import Vue from 'vue'
import App from './components/App.vue'
import Home from './components/Home.vue'
import EventPage from './components/EventPage.vue'
import auth from './auth/index.js'
import VueAxios from 'axios'
import VueRouter from 'vue-router'
import VueResource from 'vue-resource'
import VueAuth from 'vue-auth'
import GSignInButton from 'vue-google-signin-button'
import vueSmoothScroll from 'vue-smooth-scroll'


Vue.use(VueResource)
Vue.use(VueRouter)
Vue.use(VueAuth)
Vue.use(GSignInButton)
Vue.use(vueSmoothScroll)

window.axios = VueAxios

export var router = new VueRouter({
  routes: [
    ...
  ]
})

const app = new Vue({
  router,
  el: '#app',
  render: h => h(App)
})

这是EventPage.vue组件：

...

import auth from '../auth'
import {router} from '../index'
import { Card, createToken } from 'vue-stripe-elements'
import { StripeCheckout } from 'vue-stripe'

export default {
...
}

我也尝试在index.js文件中导入模块

Vue和Stripe Checkout。 vue-stripe throw错误

0 个答案: