module.exports = {

    pages:{

        index: {

            entry: 'src/pages/home/index.js',   //index.js为入口文件

            template: 'public/index.html',   //html页面文件

            title: 'Home Page',

        }

    }

}

import Vue from 'vue'       　//直接引入vue

import App from './App.vue'   //引入APP.vue, template文件

Vue.config.productionTip = false   //阻止vue在启动时控制台生成生产提示

new Vue({             //实例化Vue

  render: h => h(App),   //将template(APP)代码写入到 html页面文件(vue的作用域中:'#app')

}).$mount('#app')    //vue的作用域'#app'

//上面的代码相当于
new Vue({
　　el: '#app',
　　components:{HelloWorld}
})
//实例化了Vue, 确定vue的作用域'#app', 并且将template文件写入到'#app'作用域中, vue可解析template代码, 并注册了一个组件:Helloworld

<template>

  <div id="app">

    <img alt="Vue logo" src="./../../assets/logo.png">

    <HelloWorld msg="Welcome to Your Vue.js App"/>          //组件: HelloWord, 通过msg父子传值

  </div>

</template>

<script>

import HelloWorld from './../../components/HelloWorld.vue'   //引用组件: HelloWord, 因为index.js中仅注册了组件名称, 还需要引入组件内容

export default {      //export default, 向外暴露一个对象

  name: 'app',　　　　//给组件起的名字, 暂时未用到

  components: {       //将局部组件components也暴露给index.js

    HelloWorld

  }

}

</script>