Результаты загрузки компонента в "Имя модуля еще не загружено для контекста" - PullRequest
0 голосов
/ 08 декабря 2018

Я пытаюсь узнать больше о Vue.js, но борюсь с проблемой.Я пытаюсь использовать файлы .vue, чтобы у меня был код шаблона внутри этого файла.Мой HTML-код выглядит следующим образом.

<!DOCTYPE html>
<html lang="en" dir="ltr">
  <head>
    <meta charset="utf-8">
    <title></title>

    <script src="vue.js"></script>
    <script src="require.js"></script>
  </head>
  <body>
    <div id="app">
      <navbar-component></navbar-component>
    </div>
    <script src="./main.js"></script>

  </body>
</html>

А мой рабочий код JavaScript / Vue.js выглядит следующим образом.

Vue.component('navbar-component', {
  template: '<h3>Title</h3>'
});

const demo = new Vue({
  el: '#app',
  mounted() {
    console.log('mounted');
  }
});

Проблема заключается в том, что я изменяю его для использования этого JavaScript.Когда я пытаюсь загрузить файл test.vue, он больше не работает, и я получаю эту ошибку.

require.js:168 Uncaught Error: Module name "src/components/test.vue" has not been loaded yet for context: _. Use require([])
https://requirejs.org/docs/errors.html#notloaded
    at makeError (require.js:168)
    at Object.localRequire [as require] (require.js:1436)
    at requirejs (require.js:1797)
    at main.js:1

Мой последний тестовый код выглядит следующим образом:

main.js

Vue.component('navbar-component', require('./src/components/test.vue'));

const demo = new Vue({
  el: '#app',
  mounted() {
    console.log('mounted');
  }
});

src / components / test.vue

<template>
  <div class="helloworld">
      <h1>Hello world</h1>
  </div>
</template>

<script>
</script>
...