VUE项目中main.js、App.vue、import...from...等重要文件的作用和意义

一、main.js Vue程序入口
1、 main.js 程序入口文件，初始化vue实例，并引入使用需要的插件和各种公共组件.

// The Vue build version to load with the `import` command
// (runtime-only or standalone) has been set in webpack.base.conf with an alias.
import Vue from 'vue'
import App from './App'
import router from './router'

import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'

Vue.use(ElementUI)

Vue.config.productionTip = false

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

 new Vue代表新建vue对象
 el官方解释：为实例提供挂载元素。值可以是 CSS 选择符，或实际 HTML 元素，或返回 HTML 元素的函数。这里就通过index.html中的<div id="app"><div>中的id=“app”和这里的“#app”进行挂载。
 components:代表组件。这里的App，实际是App:App的省略写法，template里使用的 <App/>标签来自组件App。
 template：代表模板。官方解释：模板将会替换挂载的元素。挂载元素的内容都将被忽略。
 也就是说:template: '<App/>' 表示用<App></App>替换index.html里面的<div id="app"></div>