main.js index.html与app.vue三者关系详解

main.js index.html与app.vue三者关系详解

main.js与index.html是nodejs的项目启动的首加载页面资源与js资源,app.vue则是vue页面资源的首加载项

首先启动项目 v8找到index.html与main.js, 执行main.js时遇到

根据import加载app.vue文件(.vue文件可以不是叫app 可以是diyName.vue 但没必要)

然后new Vue的操作是用vue渲染index.html中的"#app" Dom元素渲染规则是 "template: <App/>"直接将其渲染为上一步components调用的局部组件"App"(这儿就可以改为 components:{diyName}, template:'<diyName></diyName>') ;

一般生产使用都是在main.js的new Vue是加上自定义router

 

vue入口文件main.js

 版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/evendetail/article/details/78623097

入口文件与app.vue 相关联

import Vue from 'vue'
// main.js 为入口文件,并与app.vue组件向关联使此组件为跟组件
// 是所有的内容都在app.vue 上面呈现。
import App from './App' // 在router里配置路由,将app组件相关联 import router from './router' Vue.config.productionTip = false /* eslint-disable no-new */ // 生成vue的根实例;创建每个组件都会生成一个vue的实列,并且会用到根实例上面的所有属性 new Vue({ el: '#app', router, // 声明模版 template: '<App/>', // 注册成组件 components: { App } })

转载于:https://www.cnblogs.com/bwdblogs/p/11144011.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值