代码之家 › 专栏 › 技术社区 › Jip Helsen

在vue 3中导入bootstrapVue

bootstrap-vue import vue.js typescript javascript

0

Jip Helsen · 技术社区 · 3 年前

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

import { BootstrapVue } from 'bootstrap-vue'

createApp(App).use(router).use(BootstrapVue).mount('#app')

src/main.ts:9:32
TS2345: Argument of type 'BootstrapVuePlugin' is not assignable to parameter of type 'Plugin_2'.
  Type 'BootstrapVuePlugin' is not assignable to type '{ install: PluginInstallFunction; }'.
    Types of property 'install' are incompatible.
      Type 'PluginFunction<BvConfigOptions>' is not assignable to type 'PluginInstallFunction'.
        Types of parameters 'Vue' and 'app' are incompatible.
          Type 'App<any>' is missing the following properties from type 'VueConstructor<Vue>': extend, nextTick, set, delete, and 3 more.
     7 |
     8 |
  >  9 | createApp(App).use(router).use(BootstrapVue).mount('#app')
       |                                ^^^^^^^^^^^^
    10 |

有人知道这个问题的解决办法吗? 提前谢谢。

1 回复 | 直到 3 年前

1

tony19 thanksd 3 年前

bootstrap-vue (v2.21.2)仅支持Vue 2,但在跟踪Vue 3支持方面存在GitHub问题 ( bootstrap-vue Issue #5196) .

与此同时,还有一个问题 third-party version that supports Vue 3 :

bootstrap bootstrap-vue-3 :

npm i -S bootstrap bootstrap-vue-3

初始化在里面 main.ts :

import { createApp } from 'vue'
import BootstrapVue3 from 'bootstrap-vue-3'

// Since every component imports their Bootstrap functionality,
// the following line is not necessary:
// import 'bootstrap'

import 'bootstrap/dist/css/bootstrap.css'
import 'bootstrap-vue-3/dist/bootstrap-vue-3.css'

const app = createApp(App)
app.use(BootstrapVue3)
app.mount('#app')