shims-vue.d.ts 解析
TypeScript的文档看起来比较让人匪夷所思
TS是从2012年就开始的项目,那时ES6的模块化还没有成为继定标准,所以今天来看TS中一些名词让人匪夷所思,其实都是历史遗留问题
比如namespace 原来也叫module,是internal module, 而module被称为external module,
随着时间推移和es6模块化标准的问世, 内部模块被改名为了namespace... 官方的handbook没有提一些历史遗留的问题,很多东西需要自己自己上网查资料
或许 这就是微软把 财大气粗技术强,随意造火箭..
研究一下用vue-cli初始化ts项目生成的shims-vue.d.ts:
// shims-vue.d.ts
declare module '*.vue' {
import Vue from 'vue'; // 引用了type和value
(// value是Vue构造器 type是Vue interface)
export default Vue;
}
这句话的意思是 声明一个ambient module(即:没有内部实现的 module声明)
使用了Wildcard module declarations
具体参见: http://www.typescriptlang.org/docs/handbook/modules.html
在TypeScript编译器解析 import ‘aaa’ from xxx.vue的时候
拿到node_modules/vue/目录下 index.d.ts 中export default出来的type和value,
type是Vue接口
value是 const Vue,这个常量的类型是VueConstructor
(图中是从'vue'中import中得到的type和 value)
一个import 能同时import到两个东西,import了一种type 还import了一个value
具体参见:http://www.typescriptlang.org/docs/handbook/declaration-files/deep-dive.html
(当我引用一个vue组件的时候,也拿到了type 和 value)
这里value是TemplateSearch,类型是Vue构造器
使用value: TemplateSearch. 当点(.) 的时候就能拿到他一些属性,因为这个值是VueConstructor类型
使用type: let a:TemplateSearch 就能使用type 这个type是interface Vue
上面说拿到了node_modules/vue/目录下index.d.ts中export default出来的type 和 value,那么我们来看一下这个东东是什么:
在index.d.ts下:
export default的东西是从当前vue.d.ts下导出的Vue
我们来看vue.d.ts:
23行导出了type Vue, 129行导出了 value Vue 这两个东西都被export default出来了 当你import的时候 就拿到了这两个东西,并且改成了你import的名字。
shims-vue.d.ts 解析的更多相关文章
- 【vuejs深入二】vue源码解析之一,基础源码结构和htmlParse解析器
写在前面 一个好的架构需要经过血与火的历练,一个好的工程师需要经过无数项目的摧残. vuejs是一个优秀的前端mvvm框架,它的易用性和渐进式的理念可以使每一个前端开发人员感到舒服,感到easy.它内 ...
- 【vuejs深入三】vue源码解析之二 htmlParse解析器的实现
写在前面 一个好的架构需要经过血与火的历练,一个好的工程师需要经过无数项目的摧残. 昨天博主分析了一下在vue中,最为基础核心的api,parse函数,它的作用是将vue的模板字符串转换成ast,从而 ...
- Vue源码解析(一):入口文件
在学习Vue源码之前,首先要做的一件事情,就是去GitHub上将Vue源码clone下来,目前我这里分析的Vue版本是V2.5.21,下面开始分析: 一.源码的目录结构: Vue的源码都在src目录下 ...
- Vue源码解析---数据的双向绑定
本文主要抽离Vue源码中数据双向绑定的核心代码,解析Vue是如何实现数据的双向绑定 核心思想是ES5的Object.defineProperty()和发布-订阅模式 整体结构 改造Vue实例中的dat ...
- Vue源码解析之nextTick
Vue源码解析之nextTick 前言 nextTick是Vue的一个核心功能,在Vue内部实现中也经常用到nextTick.但是,很多新手不理解nextTick的原理,甚至不清楚nextTick的作 ...
- Vue中v-model解析、sync修饰符解析
上善若水,水善利萬物而不爭.——<道德經> 简介 在平时开发是经常用到一些父子组件通信,经常用到props.vuex等等,这里面记录另外的三种方式v-model.sync是怎么使用,再说是 ...
- 【VUE】Vue 源码解析
Vue 源码解析 Vue 的工作机制 在 new vue() 之后,Vue 会调用进行初始化,会初始化生命周期.事件.props.methods.data.computed和watch等.其中最重要的 ...
- Vue 源码解析:深入响应式原理(上)
原文链接:http://www.imooc.com/article/14466 Vue.js 最显著的功能就是响应式系统,它是一个典型的 MVVM 框架,模型(Model)只是普通的 JavaScri ...
- vue 模板如何解析
1.模板 一个最简答的模板: <div id="app"> {{ message }} </div> v-for模板: <ul id="ex ...
随机推荐
- [转载]排序:长度为n的数组乱序存放着0至n-1. 现在只能进行0与其他数的swap
长度为n的数组乱序存放着0至n-1. 现在只能进行0与其他数的swap 请设计并实现排序. google笔试小题.题目来源:http://wenku.baidu.com/view/5aa818dda5 ...
- sed 的用法
sed 的语法: sed `样式命令` 文件 意思是:如果文件中的某一行符合”样式”,就执行指定的 sed 命令,如删除(d)或替换(s) “样式”使用一对//含括,表示寻找的意思.也可以指定数据行的 ...
- 总结linux内核的一些参数优化
sysctl命令被用于在动态地修改内核的运行参数,可用的内核参数在目录/proc/sys中. 它包含一些TCP/IP堆栈和虚拟内存系统的高级选项, 用sysctl可以读取设置超过五百个系统变量. sy ...
- mysql个人初配置
记录下在ubuntu 18.04.3 LTS环境中安装mysql和个人初期简单设置. 1:安装myslq:sudo apt install mysql-server. 2:设置root密码.由于我没有 ...
- psu补丁
1.查看命令 su - oracle opatch lspatches su - grid opatch lspatches
- MapReduce 中的两表 join 方案解析
1. 概述 在传统数据库(如:MYSQL)中,JOIN操作是非常常见且非常耗时的.而在HADOOP中进行JOIN操作,同样常见且耗时,由于Hadoop的独特设计思想,当进行JOIN操作时,有一些特殊的 ...
- jvm——分层编译
https://www.cnblogs.com/andy-zhou/p/5327288.html 分层编译根据编译器编译.优化的规模与耗时,划分出不同的编译层次: 第0层:程序解释执行,解释器不开启监 ...
- 使用tensorflow训练word2vec
from http://blog.csdn.net/wangyangzhizhou/article/details/77530479?locationNum=1&fps=1 使用了tensor ...
- linux下部署nginx服务
1.安装依赖包 yum -y install gcc zlib zlib-devel pcre-devel openssl openssl-devel 2.下载并解压安装包 cd /usr/loc ...
- vmware哪个版本好用
这个问题要根据你的物理机操作系统而定,如果你电脑是xp,就选择vmw7.1.6:如果你电脑是win7,win8,win8.1,就选择vmw10.0.1.不要去理会vmw8.vmw9这些都是vmw10的 ...