第二篇 初始化项目main.js 的挂载

项目结构

src 结构

├── App.vue                          APP入口文件            
├── main.js                         // 项目配置文件    
├── components                      // 组件文件夹                  
├── router                          // 路由配置文件夹
│   └── index.js                    // 路由配置文件

main.js 代码解析

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

Vue.config.productionTip = false

/* eslint-disable no-new */
new Vue({
  el: '#app',
  router,       
  render: h => h(App)   
})

注解 

// 1, routes（缩写）相当于 routes: routes

// 2, render函数是渲染一个视图，然后提供给el挂载，如果没有render那页面什么都不会出来

   // 写法 1
   new Vue({
          router,
          //components: { App }  vue1.0的写法
          render: h => h(App)    vue2.0的写法
          }).$mount('#app')
    // 写法 2 
   new Vue({
      el: '#app',
      // store,
      // router,
      template: '<App/>',
      components: {App}
     })
PS : 还有   el: '#app', 或.$mount('#app')手动挂载写法