javascript – Wie die vue.js-Datei app.vue heißt

Question

Ich bin neu bei vue.js. Ich weiß nur, dass main.js die Eintragsdatei und app.vue die Hauptkomponente ist. Warum entferne ich den Export-Standardcode in app.vue und importiere die App aus „.app“. main.js, aber die Seite kann den Inhalt in app.vue

anzeigen

app.vue-Konfiguration

<template>
  <p id="app">
    <p class='header'>
      I am header!
    </p>
    <p class='tab'>
      I am tab
    </p>
    <p class='content'>
      I am content
    </p>
  </p>
</template>

<script> 
</script>

<style>
</style>

main.js-Datei

import Vue from 'vue';
import App from './App';

Vue.config.productionTip = false;

/* eslint-disable no-new */
new Vue({
  el: '#app',
  template: '<App/>',
  components: { App }
});

Kann die app.vue-Datei ohne exportmain.js empfangen werden?

Answer 1

难道终端那里没报错吗

Answer 2

这没毛病啊，vue并没有规定必须使用export default，如果你想要知道原因，build一下你写的这个例子，看看生成的app.js里面的代码就知道是怎么回事了

Answer 3

vue-loader 的作用

https://vue-loader.vuejs.org/...

<template>
默认语言：html。
每个 .vue 文件最多包含一个 <template> 块
内容将被提取为字符串，将编译并用作 Vue 组件的 template 选项。

没有 export 就相当于一个只有 template 选项的组件

Vue.component('my-component', {
  template: '<span>only template</span>'
})