简体   繁体   English

Bootstrap-Vue是否损坏?

[英]Is Bootstrap-Vue broken?

This is a followup question of my last question , and again, I am trying to get Vue and Bootstrap to work in a minimalistic setup ontop of Node.js. 这是我最后一个问题的后续问题, 再次尝试使Vue和Bootstrap在Node.js的简约设置中工作。 For this, I am not using any package manager or CDN, but instead I have all the required files available next to the webpage. 为此,我没有使用任何程序包管理器或CDN,而是在网页旁边提供了所有必需的文件。

Now, instead of using Bootsrap and Vue I am using the Bootstrap-Vue library with Vue, but I didn't get it to work no matter what. 现在,我将Bootstrap-Vue库与Vue一起使用,而不是使用Bootsrap和Vue,但是无论如何我都没有使其工作。 All Bootstrap-Vue elements would only display as plain text, so I started working my way back until I had the simplest setup imaginable: 所有Bootstrap-Vue元素都只会显示为纯文本,因此我开始回头工作,直到可以想到的最简单的设置为止:

<!DOCTYPE html>
<html lang="en">
    <head>
        <title>Index</title>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
        <link type="text/css" rel="stylesheet" href="https://unpkg.com/bootstrap@next/dist/css/bootstrap.min.css"/>
        <link type="text/css" rel="stylesheet" href="https://unpkg.com/bootstrap-vue@latest/dist/bootstrap-vue.css"/>
    </head>
    <body>

        <div class="text-center my-3">
            <b-btn v-b-popover.hover="'I am popover content!'" title="Popover Title">Hover Me</b-btn>
        </div>

        <script src="https://unpkg.com/vue"></script>
        <script src="https://unpkg.com/babel-polyfill@latest/dist/polyfill.min.js"></script>
        <script src="https://unpkg.com/bootstrap-vue@latest/dist/bootstrap-vue.js"></script>

    </body>
</html>

But even this super simple webpage is not being displayed correctly. 但是,即使这个超级简单的网页也无法正确显示。 Testing with native Bootstrap components does work, but all the Bootstrap-Vue stuff does not. 使用本机Bootstrap组件进行测试确实可以,但是所有Bootstrap-Vue都不能。 Vue is being excecuted and my Debug Console tells me that it successfully requested all script files needed. Vue正在被执行,我的调试控制台告诉我它成功请求了所有需要的脚本文件。

It should be noted that the webpage looks the same, regardless of me requesting it via Node.js or manually opening the document. 应该注意的是,无论我通过Node.js请求网页还是手动打开文档,该网页看起来都是一样的。

So, what is the problem? 那么,有什么问题呢?

Are you applying Vue to your template? 您要将Vue应用于模板吗?

 new Vue({ el: '#app' }); 
 <link href="//unpkg.com/bootstrap@next/dist/css/bootstrap.min.css" rel="stylesheet" /> <link type="text/css" rel="stylesheet" href="https://unpkg.com/bootstrap-vue@latest/dist/bootstrap-vue.css" /> <script src="https://unpkg.com/vue"></script> <script src="https://unpkg.com/bootstrap-vue@latest/dist/bootstrap-vue.js"></script> <div id="app" class="text-center my-3"> <b-btn vb-popover.hover="'I am popover content!'" title="Popover Title">Hover Me</b-btn> </div> 

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM