Laksanakan penyepaduan bootstrapVue TypeScript dan Vue3

Question

Menggunakan use(BootstrapVue as any) membetulkan ralat berikut, tetapi ia masih tidak berfungsi dalam penyemak imbas.

main.ts：

import { createApp }dari 'vue';
import Apl daripada './App.vue';
import penghala daripada './router';
import Keluaran daripada './components/Release.vue'; // @ ialah alias kepada /src
import {BootstrapVue} daripada 'bootstrap-vue';
//import Vuelidate daripada 'vuelidate'

// Import Bootstrap dan fail CSS BootstrapVue (pesanan adalah penting)
import 'bootstrap/dist/css/bootstrap.css'
import 'bootstrap-vue/dist/bootstrap-vue.css'


// Secara pilihan pasang pemalam komponen ikon BootstrapVue
//use(BootstrapVue as any) boleh betulkan.
createApp(App).use(BootstrapVue).component('Release', Release)
.use(router).mount('#app')

运行 npm run serve 时出现错误：

TUNGGU Menyusun... 9:57:17 PG

98% selepas mengeluarkan CopyPlugin

 AMARAN Disusun dengan 1 amaran 9:57:18 AM

 amaran dalam ./node_modules/bootstrap-vue/esm/vue.js

"eksport 'lalai' (dieksport semula sebagai 'Vue') tidak ditemui dalam 'vue'


  Apl berjalan di:
  - Setempat: http://localhost:8080/ 

Isu semakan sedang berjalan...
RALAT dalam src/main.ts:15:20
TS2345: Argumen jenis 'BootstrapVuePlugin' tidak boleh diberikan kepada parameter jenis 'Plugin_2'.
  Jenis 'BootstrapVuePlugin' tidak boleh diberikan untuk menaip '{ install: PluginInstallFunction; }'.
    Jenis 'pemasangan' harta tidak serasi.
      Taip 'PluginFunction<BvConfigOptions>' tidak boleh diberikan untuk menaip 'PluginInstallFunction'.
        Jenis parameter 'Vue' dan 'app' tidak serasi.
          Taip 'Apl<sebarang>' tiada sifat berikut daripada jenis 'VueConstructor<Vue>': lanjutkan, nextTick, tetapkan, padam dan 3 lagi.
    13 | // Secara pilihan pasang pemalam komponen ikon BootstrapVue
    14 | //Vue.use(IconsPlugin).use(BootstrapVue as any)
  > 15 | createApp(App).use(BootstrapVue).component('Release', Release)
       |                    ^^^^^^^^^^^^
    16 | .use(router).mount('#app')

浏览器控制台输出：

Uncaught TypeError: Tidak dapat membaca 'prototaip' sifat yang tidak ditentukan
    di eval (config.js?228e:6)
    di Module../node_modules/bootstrap-vue/esm/utils/config.js (chunk-vendors.js:3924)
    di __webpack_require__ (app.js:849)
    di fn (app.js:151)
    at eval (props.js?cf75:1)
    di Module../node_modules/bootstrap-vue/esm/utils/props.js (chunk-vendors.js:4200)
    di __webpack_require__ (app.js:849)
    di fn (app.js:151)
    di eval (model.js?58f2:1)
    di Module../node_modules/bootstrap-vue/esm/utils/model.js (chunk-vendors.js:4116)

Answer 1

Anda perlu memasang bootstrap-vue-3

LARI npm i --save bootstrap-vue-3

Kemudian tambah kod berikut di dalam main.js 或 main.ts:

//bootstrap vue
import BootstrapVue3 from 'bootstrap-vue-3';
app.use(BootstrapVue3);