Vue.js 在本地计算机上加载Vue应用程序时出现问题,无法获得所需的结果

Vue.js 在本地计算机上加载Vue应用程序时出现问题,无法获得所需的结果,vue.js,Vue.js,期望结果 结果我得到了 Header.vue代码 <template> <nav class="navbar navbar-default"> <div class="container-fluid"> <div class="navbar-header"> <router-link to="/" class="navbar-

期望结果

结果我得到了

Header.vue代码

<template>
     <nav class="navbar navbar-default">
  <div class="container-fluid">
<div class="navbar-header">
     <router-link to="/" class="navbar-brand">Stock Trader</router-link>
     </div>
    
    
    <div class="collapse navbar-collapse" >
      <ul class="nav navbar-nav">
           <router-link to="/portfolio" activeClass="active" tag="li"><a>Portfolio</a></router-link>
           <router-link to="/stocks" activeClass="active" tag="li"><a>Stocks</a></router-link>
        </ul>
        <ul class="nav navbar-nav navbar-right">
             <li><a href="#">End day</a> </li>
             <li class="dropdown">
                  <a
                       href="#"
                       class="dropdown-toggle"
                       data-toggle="dropdown"
                       role="button"
                       aria-haspopup="true"
                       aria-expanded="false">Save & Load <span class="caret"></span></a> 
            <ul class="dropdown-menu">
            <li><a  href="#">Save Data</a></li>
            <li><a  href="#">Load Data</a></li>
           
              </ul>
        </li>
   </ul>
 </div>
</div>
</nav>
</template>


Advise me if anything else is required.

index.html


<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="utf-8">
    <title>Stock Trader</title>
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous">
   
<!-- <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-+0n0xVW2eSR5OomGNYDnhzAbDsOXxcvSN1TPprVMTNDbiYZCxYbOOl7+AMvyTG2x" crossorigin="anonymous"> -->
  </head>
  <body>
    <div id="app">
    </div>
    <script src="/dist/build.js"></script>
  </body>
</html>

股票交易员
如果还需要什么,请告诉我。 index.html 股票交易员

请注意:在本地计算机上加载Vue应用程序时出现问题,无法获得所需的结果。我收到了一个警告,但是按f12检查后没有CORS错误


我附上了显示警告的第三个屏幕截图,请查找以下代码

<template>
  <div>
    <nav class="navbar navbar-expand-lg navbar-light bg-light">
      <router-link class="nav-link" to="/">Stock Trader</router-link>

      <div class="collapse navbar-collapse" id="navbarSupportedContent">
        <ul class="navbar-nav mr-auto">
          <li class="nav-item active">
            <router-link class="nav-link" to="/portfolio"
              >Portfolio <span class="sr-only">(current)</span></router-link
            >
          </li>
          <li class="nav-item">
            <router-link class="nav-link" to="/stocks">Stocks</router-link>
          </li>
        </ul>
      </div>
    </nav>
  </div>
</template>

股票交易员
  • 投资组合(当前)
  • 股票
确保正确安装了引导程序

npm安装--保存引导//安装引导 使用下面的导入在vue的main.js文件中导入
导入“bootstrap/dist/css/bootstrap.min.css”

您的css样式没有导入-您正在尝试使用bootstrap吗?还是另一个框架?它还可以帮助我们提供一个链接,您从哪里获取代码,因为听起来您好像是从某处提取代码:)是的,我正在使用引导,我在index.html上提到了它。我正在学习一门课程并遵循代码。如果按F12键,您是否在控制台中看到CORS错误?您是否也可以发布您的index.html文件无错误,但是得到一个警告。是的,我肯定会编辑我的帖子,并且会发布警告以及我的索引文件,因为评论是不允许的。只在一段时间内有效,但是当我尝试为引导样式添加更多内容时。没有得到想要的结果。