未知自定义元素:使用 Buefy 时为 x

Question

我遵循Buefy准则

npm install Buefy

在主.ts 中

import Vue from 'vue';
import Buefy from 'buefy';
import axios from 'axios';
import VueAxios from 'vue-axios';
import 'buefy/dist/buefy.css';
import App from './App.vue';
import router from './router';
import store from './store';
Vue.config.productionTip = false;
Vue.use(VueAxios, axios, Buefy);
new Vue({
router,
store,
render: h => h(App),
}).$mount('#app');

在 Home.vue (视图(

<section>
<b-button @click="clickMe">
Click Me
</b-button>
</section>

然后当我运行时，我收到此错误

Unknown custom element: <b-button> - did you register the component correctly? For recursive components, make sure to provide the "name" option.
found in
---> <Home> at src/views/Home.vue
<App> at src/App.vue
<Root>

我认为 Vue.use(Buefy( 加载所有组件？

我错过了什么来让 Buefy 工作？

Answer 1

你可以从 Vue 实例 Vue.use(( 中删除 axios，因为 axios 还不是一个插件。您可以改为使用带有它的运算符来全局访问它。

import Axios from 'axios'
Vue.prototype.$http = Axios;

现在您将能够使用 this.$http.post("https://api.com"(.then((.catch(( 访问 请注意，use采用第一个参数，你应该使用多个Vue.use((来允许插件很好地工作

Answer 2

我必须在tests/setup.js中包含以下行，以便在测试设置期间注册组件。

import Buefy from 'buefy';
Vue.use(Buefy)

我的main.js没有执行测试。

我是开玩笑测试的新手，所以也许这是一个怪物，有更好的方法可以做到这一点。但它对我有用。