vue项目中主要文件的加载顺序(index.html、App.vue、main.js)
先后顺序:
index.html > App.vue的export外的js代码 > main.js > App.vue的export里面的js代码 > Index.vue的export外的js代码
测试的页面代码块:




文件的加载先后顺序:

Index.vue的mounted()中的输出没有执行。why?
--------------------------------------------------------------------------------------------------------------------------
每个 Vue 应用都是通过用 Vue 函数创建一个新的 Vue 实例开始的,所以我们试下延迟创建新的Vue实例的情况下加载的顺序。
这里主要修改的是App.vue和main.js的代码,index.html和Index.vue主要是添加执行的时间:



index.html > App.vue的export外的js代码 > main.js调用公共函数外的代码 > App.vue公共函数的定时器外的代码 > main.js调用公共函数内创建实例前的代码 > App.vue的export里面的js代码 > main.js调用公共函数内创建实例后的代码 > App.vue公共函数的定时器内执行回调函数后的代码 > Index.vue的export外的js代码
可以看到创建实例的前后,中间执行了一次App.vue中的mounted内的代码
vue项目中主要文件的加载顺序(index.html、App.vue、main.js)的更多相关文章
- vue项目中主要文件的加载顺序(index.html、main.js、App.vue)
todo: https://www.cnblogs.com/xifengxiaoma/p/9493544.html https://www.cnblogs.com/stella1024/p/10563 ...
- Java之——Web项目中DLL文件动态加载方法
本文转自:https://blog.csdn.net/l1028386804/article/details/53903557 在Java Web项目中,我们经常会用到通过JNI调用dll动态库文件来 ...
- vue项目中实现图片懒加载的方法
对于图片过多的页面,为了加速页面加载速度,所以很多时候我们需要将页面内未出现在可视区域内的图片先不做加载, 等到滚动到可视区域后再去加载.这样子对于页面加载性能上会有很大的提升,也提高了用户体验. 实 ...
- Vue项目中实现图片懒加载
个人网站 https://iiter.cn 程序员导航站 开业啦,欢迎各位观众姥爷赏脸参观,如有意见或建议希望能够不吝赐教! ---对于图片过多的页面,为了加速页面加载速度,所以很多时候我们需要将页面 ...
- Vue项目中的文件/文件夹命名规范
Vue项目中的文件/文件夹命名规范 0.2262018.09.21 16:01:09字数 820阅读 6979 文件或文件夹的命名遵循以下原则: index.js 或者 index.vue,统一使用小 ...
- vue项目中一些文件的作用
原文 简书原文:https://www.jianshu.com/p/38749e5bec3c 大纲 1.vue项目结构 2.主要的配置文件 2.1.package.json 2.2.dev-serve ...
- vue项目实现路由按需加载的3种方式
vue异步组件技术 ==== 异步加载vue-router配置路由 , 使用vue的异步组件技术 , 可以实现按需加载 .但是,这种情况下一个组件生成一个js文件 /* vue异步组件技术 */ { ...
- WEB相关文件的加载顺序
一. 1.启动一个WEB项目,WEB容器会先去读取它的配置文件web.xml,读取<context-param>和<listener>两个节点. 2.接着,容器创建一个Serv ...
- <context-param> 标签引出的 web.xml 文件的加载顺序 [转]
代码示例 : <context-param> <param-name>contextConfigLocation</param-name> <param-va ...
随机推荐
- Linux内核基本装载卸载
Linux由两部分组成:内核核心+内核模块核心的命名通常是vmlinuz-VERSION-release,模块的放置于/lib/modules/VERSION-release/ 一旦系统运行起来,内核 ...
- docker构建镜像
Docker 提供了两种构建镜像的方法: docker commit 命令Dockerfile 构建文件 示例: Dockerfile FROM golang:1.7.5 #基础镜像 RUN apt- ...
- 《Java并发编程的艺术》Java内存模型(三)
Java内存模型 一.Java内存模型的基础 1.并发编程模型的两个关键问题: 两个关键问题,线程之间如何通信和如何同步.两种方式,共享内存和消息传递.Java里线程的通信是通过共享内存,线程的同步是 ...
- HTML5-之workers(多线程执行)
注:test.js 不涉及DOM元素
- Jquery 数组操作大全【转载】
转载于:https://www.jb51.net/article/43164.htm 1. $.each(array, [callback]) 遍历[常用] 解释: 不同于例遍 jQuery 对象的 ...
- 解决 ERROR: missing Change-Id in commit message footer 问题
提交代码操作 git push origin HEAD:refs/for/XXX,提示失败ERROR: missing Change-Id in commit message footer,丢失Cha ...
- python第三天基础之字符编码
一 了解字符编码的知识储备 1. 文本编辑器存取文件的原理(nodepad++,pycharm,word) 打开编辑器就打开了启动了一个进程,是在内存中的,所以在编辑器编写的内容也都是存放与内存中的, ...
- linux系统下部署DNS正向解析
DNS服务概述: DNS(Domain Name System)域名系统,能够提供域名与IP地址的解析服务. 正向解析 正向解析是指域名到IP 地址的解析过程. 部署DNS正向解析 DNS服务的三个配 ...
- 重装win10+ubuntu 双系统 UEFI启动模式
有较强的时效性!!先看一眼日期是否太古老! 任务 卸载双系统中的Ubuntu14,安装Ubuntu16 环境 操作系统: Win10 + Ubuntu14双系统 硬盘: 固态硬盘 + 机械硬盘,电脑的 ...
- String StringBuilder StringBuffer区别
String StringBuilder StringBuffer String类是final类,不可以被继承,且它的成员方法也是final方法,当一个字符串对象进行操作操作时,任何的改变不会影响到这 ...