vue專案中app.vue 、main.js和 index.html的關聯
阿新 • • 發佈:2018-12-08
1.main.js是我們的入口檔案,主要作用是初始化vue例項並使用需要的外掛。
import Vue from 'vue' import App from './App' /* eslint-disable no-new */ new Vue({ el: '#app', template: '<App/>', components: { App } })
2.App.vue是我們的主元件,所有頁面都是在App.vue下進行切換的。其實你也可以理解為所有的路由也是App.vue的子元件。所以我將router標示為App.vue的子元件。
<template> <div id="app"> <img src="./assets/logo.png"> <hello></hello> </div> </template> <script> import Hello from './components/Hello' export default { name: 'app', components: { Hello } } </script> <style> #app { font-family: 'Avenir', Helvetica, Arial, sans-serif; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-align: center; color: #2c3e50; margin-top: 60px; } </style>