Vue路由器空白页

时间:2019-06-26 13:49:59

标签: vue.js vue-router

我想将我的html模板迁移到vue路由器。我做我可以使用npm run serve代码查看我的项目。不是npm run dev。使用vue创建代码创建的项目。我建立了这个项目和index.html空白页。不是控制台错误或任何错误。

我用webpack尝试了一个新的vue项目。 (vue init webpack项目)然后在main.css文件中给我一个链接错误。

Routes.js:

 import Home from './components/Home';
export const routes = [
  { path: '/', component : Home , name : 'home', 
  meta: {
      title: 'Web Page',
      metaTags: [
        {
          name: 'description',
          content: 'The home page of our example app.'
        },
        {
          property: 'og:description',
          content: 'The home page of our example app.'
        }
      ]
    }
  }
]

Public/index.html (imported css and js files) : 
<!doctype html>
<html lang="tr">

<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, 
 shrink-to-fit=no">
<link rel="icon" href="./favicon.ico">

<!-- Bootstrap core CSS -->
<link href="/css/bootstrap.min.css" rel="stylesheet">
<!-- main css file -->
<link href="/css/main.min.css" rel="stylesheet">

</head>

<body><!-- start body -->
<noscript>
  <strong>We're sorry but kriptovue doesn't work properly without 
JavaScript enabled. Please enable it to continue.</strong>
</noscript>
<div id="app"></div>
<!-- built files will be auto injected -->
  <!-- jquery -->
<script src="/js/jquery.min.js"></script>
<script src="/js/popper.min.js"></script>
<!-- bootstrap JavaScript -->
<script src="/js/bootstrap.min.js"></script>
<!-- template JavaScript -->
<script src="/js/template-scripts.js"></script>
<!-- flickity JavaScript -->
<script src="/js/flickity.pkgd.min.js"></script>
<!-- carousel JavaScript -->
<script src="/owlcarousel/owl.carousel.min.js"></script>
<!-- parallax JavaScript -->
<script src="/js/parallax.min.js"></script>
<!-- mailchamp JavaScript -->
<script src="/js/mailchamp.js"></script>
<!-- bootstrap offcanvas -->
<script src="/js/bootstrap.offcanvas.min.js"></script>
<!-- touchSwipe JavaScript -->
<script src="/js/jquery.touchSwipe.min.js"></script>
<!-- ajax mailer -->
<script src="/js/mailer.js"></script>
<!-- seconde style additionel JavaScript -->
<script src="/js/particles-code.js"></script>
<script src="/js/particles.js"></script>
<script src="/js/smoothscroll.js"></script>
</body>
</html>

Vue版本:2.9.6 Vue路由器版本:3.0.6

我该如何解决?

0 个答案:

没有答案