vue.js - 使用 Vue.js/Bootstrap-vue.js CDN 和组件

Question

请原谅我的无知，我是 Vue 的 super 新手。我正在寻找一种利用 CDN 中的 bootstrap-Vue 的方法(https://bootstrap-vue.js.org/docs/ 单击右侧导航栏上的浏览器)。我没有看到如何调用组件。使用 webpack/CLI 版本，没问题，但是 CDN，我不知道如何使用它。

我建立了一个简单的 codepen.io 来测试它。我已经根据文档添加了 CSS 和 js 文件。

https://codepen.io/jasonflaherty/pen/rrzbxj

//do I need this?
Vue.use(BootstrapVue);

//try individual components.
import { Card } from 'bootstrap-vue/es/components';
Vue.use(Card);

使用 bootstrap-vue.js CDN 我缺少什么？我需要以不同方式导入吗？

Answer 1

只需在下面包含所需的 CDN，而不调用 Vue.use(XXX)(官网有一个Basic example。)

        <!-- Required Stylesheets -->
        <link
          type="text/css"
          rel="stylesheet"
          href="https://unpkg.com/bootstrap/dist/css/bootstrap.min.css"
        />
        <link
          type="text/css"
          rel="stylesheet"
          href="https://unpkg.com/bootstrap-vue@latest/dist/bootstrap-vue.css"
        />

        <!-- Required scripts -->
        <script src="https://unpkg.com/vue"></script>
        <script src="https://unpkg.com/bootstrap-vue@latest/dist/bootstrap-vue.js"></script>

当您运行 Basic example ，您将获得 Bootstrap 装饰。