首页 > 解决方案 > 未检测到 Laravel 7 Vue.js

问题描述

我正在创建一个新的 Laravel 项目(Laravel 7)并希望使用 vue.js 作为前端。我通过 laravel/ui 安装它。

问题是 Vue js 似乎没有加载并且 Vue Devtools 显示vue.js not detected.
这是刀片文件和app.js

刀片文件

<!DOCTYPE html>
<html lang='en'>
  <head>
    <meta charset='UTF-8'>
    <meta name='viewport' content='width=device-width, initial-scale=1.0'>
    <link rel='shortcut icon' href='/images/favicon.ico'>
    <link rel='stylesheet' href='/css/app.css'>

    <title>Conference management</title>
  </head>

  <body>
    <div id="app">
      <section class="header">
        <div class="level-left">
          <div class="level-item">
            <div>
              <p class="title has-text-primary">Conference management</p>
            </div>
          </div>
        </div>
        <div class="level-right">
          <a href="//www.cri.or.th" class="logo">
            <img src="/images/cri_logo_s.png" alt="">
          </a>
        </div>
      </section>
      <section class="content">
        <div class="container">
          <div class="columns">
            <div class="column"></div>

            <div class="column is-half-table is-two-fifths-desktop">
              include login
              @{{ new Date }}
            </div>

            <div class="column"></div>
          </div>
        </div>
      </section>

      <footer class="footer">
        <div class="content has-text-centered">
            &copy; @{{ year }} Organization
        </div>
      </footer>
    </div>

    <script type="text/javascript" src="/js/app.js">
  </body>
</html>

应用程序.js

require('./bootstrap');

window.Vue = require('vue');

Vue.config.devtools = true;


Vue.component('example-component', require('./components/ExampleComponent.vue').default);

const app = new Vue({
    el: '#app',
    year: (new Date).getFullYear()
});

npm run dev成功运行并且 css 和 js 链接指向了正确的文件。

我在这里能错过什么?

标签: laravelvue.js

解决方案


您可以为您的项目遵循本教程吗:链接

也许您忘记使用 npm vuejs 安装。

告诉我你是否再次遇到这个问题:)。


推荐阅读