main.js代码:

import Vue from 'vue'                                        // 导入Vue对象

import App from './App'                                    // 导入App.vue组件,.vue可省略不写

import router from './router'                            // 导入router目录下所有路由

Vue.config.productionTip = false                     // 阻止启动生产消息(启动时console多显示一条信息)

new Vue({                                                             // 创建Vue实例

  el: '#app',                                                         // 挂载id='app'

  router,                                                              // 配置router,完整写法router : router

  components: { App },                                     // 组件使用App.vue,router会写入到App.vue

  template: '<App/>'                                         // 模板使用<App/>

})

在main.js中,新建了一个Vue实例,并使用el: '#app'链接到index.html中的app,并使用template引入组件<App>和路由相关的内容。也就是说通过main.js关联到App.vue组件。

提一句:项目加载的过程是index.html -> main.js -> app.vue -> index.js -> helloworld.vue

Logo

华为开发者空间,是为全球开发者打造的专属开发空间,汇聚了华为优质开发资源及工具,致力于让每一位开发者拥有一台云主机,基于华为根生态开发、创新。

更多推荐