尝试将Vue导入到Vue路由器中

问题描述 投票:0回答:1

我可以在 vue 路由器文件中写入 'import {vue} from 'vue' 吗

import home from '../components/home.vue'
import  {vue} from 'vue'
import VueMeta from 'vue-meta'
vue.use(VueMeta , {
  keyName: 'metaInfo',
  attribute: 'data-vue-meta',
  ssrAttribute: 'data-vue-meta-server-rendered',
  tagIDKeyName: 'vmid',
  refreshOnceOnNavigation: true
})
const router = createRouter({
  history: createWebHistory(),
  routes: 
    {
      path: '/',
      name: 'home',
      component: home
    },
    {
      path: '/business',
      name: 'business',
      component: () => import('../components/business.vue')
    },
    {
      path: '/about',
      name: 'about',
      component: () => import('../components/about.vue')
    },
    {
      path: '/faqs',
      name: 'faq',
      component: () => import('../components/faq.vue')
    },
    {
      path: '/termOfServices',
      name: 'termOfServices',
      component: () => import('../components/termOfServices.vue')
    }
  ],
  scrollBehavior(to, from, savedPosition) {
    if (to.hash) {
      return {
        el: to.hash,
        behavior: 'smooth'
      }
    }
    if (savedPosition) {
      return savedPosition
    } else {
      return {top: 0}
    }
  
    
  }
})

export default router

只是想知道,因为当我运行这个时,我收到错误“Uncaught SyntaxError:请求的模块'/node_modules/.vite/deps/vue.js?v=5d26be8a'不提供名为'default'的导出” 我想使用 vue-meta 库进行网站的 seo,并且从文档中我必须在路由器页面中导入 vue,然后才能使用 vue-meta

vue.js vue-router vue-meta
1个回答
0
投票

尝试这个方法:

import Vue from 'vue'
import VueMeta from 'vue-meta'

Vue.use(VueMeta, {
  keyName: 'metaInfo',
  attribute: 'data-vue-meta',
  ssrAttribute: 'data-vue-meta-server-rendered',
  tagIDKeyName: 'vmid',
  refreshOnceOnNavigation: true
})

对于Vue3的最后一个版本,尝试使用:

import { createApp } from 'vue'
import App from './App.vue'

import VueMeta from 'vue-meta'

const app = createApp(App)
app.use(VueMeta, {
  keyName: 'metaInfo',
  attribute: 'data-vue-meta',
  ssrAttribute: 'data-vue-meta-server-rendered',
  tagIDKeyName: 'vmid',
  refreshOnceOnNavigation: true
}))
© www.soinside.com 2019 - 2024. All rights reserved.