-
-
Notifications
You must be signed in to change notification settings - Fork 33.7k
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
Add typescript definition #3509
Closed
Closed
Changes from all commits
Commits
Show all changes
11 commits
Select commit
Hold shift + click to select a range
794ee6b
Add index.d.ts
kaorun343 81ccc22
Remove unnecessary comment
kaorun343 58cc89a
Remove unnecessary definition
kaorun343 9566257
Update definitions
kaorun343 0a1f118
Update definitions
kaorun343 3a3b065
Fix
kaorun343 8df7277
Add test
kaorun343 ffb0cdf
Fix ComputedOptions
kaorun343 fab7f11
Update Vue.set
kaorun343 1450ac7
Update definitions
kaorun343 da261d5
Add npm script
kaorun343 File filter
Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,2 @@ | ||
import {Vue} from "./vue.d"; | ||
export = Vue; |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,74 @@ | ||
import { Vue } from "./vue.d"; | ||
import { VNode, VNodeDirective } from "./vnode.d"; | ||
|
||
type Constructor = { | ||
new (...args: any[]): any; | ||
} | ||
|
||
export interface ComponentOptions { | ||
data?: Object | ( (this: Vue) => Object ); | ||
props?: string[] | { [key: string]: PropOptions | Constructor | Constructor[] }; | ||
propsData?: Object; | ||
computed?: { [key: string]: ((this: Vue) => any) | ComputedOptions }; | ||
methods?: { [key: string]: Function }; | ||
watch?: { [key: string]: ({ handler: WatchHandler } & WatchOptions) | WatchHandler | string }; | ||
|
||
el?: Element | String; | ||
template?: string; | ||
render?(createElement: typeof Vue.prototype.$createElement): VNode; | ||
staticRenderFns?: (() => VNode)[]; | ||
|
||
beforeCreate?(): void; | ||
created?(): void; | ||
beforeDestroy?(): void; | ||
destroyed?(): void; | ||
beforeMount?(): void; | ||
mounted?(): void; | ||
beforeUpdate?(): void; | ||
updated?(): void; | ||
|
||
directives?: { [key: string]: DirectiveOptions | DirectiveFunction }; | ||
components?: { [key: string]: ComponentOptions | typeof Vue }; | ||
transitions?: { [key: string]: Object }; | ||
filters?: { [key: string]: Function }; | ||
|
||
parent?: Vue; | ||
mixins?: (ComponentOptions | typeof Vue)[]; | ||
name?: string; | ||
extends?: ComponentOptions | typeof Vue; | ||
delimiters?: [string, string]; | ||
} | ||
|
||
export interface PropOptions { | ||
type?: Constructor | Constructor[] | null; | ||
required?: boolean; | ||
default?: any; | ||
validator?(value: any): boolean; | ||
} | ||
|
||
export interface ComputedOptions { | ||
get?(this: Vue): any; | ||
set?(this: Vue, value: any): void; | ||
cache?: boolean; | ||
} | ||
|
||
export type WatchHandler = <T>(val: T, oldVal: T) => void; | ||
|
||
export interface WatchOptions { | ||
deep?: boolean; | ||
immediate?: boolean; | ||
} | ||
|
||
export type DirectiveFunction = ( | ||
el: HTMLElement, | ||
binding: VNodeDirective, | ||
vnode: VNode, | ||
oldVnode: VNode | ||
) => void; | ||
|
||
export interface DirectiveOptions { | ||
bind?: DirectiveFunction; | ||
update?: DirectiveFunction; | ||
componentUpdated?: DirectiveFunction; | ||
unbind?: DirectiveFunction; | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,8 @@ | ||
import { Vue as _Vue } from "./vue.d"; | ||
|
||
export type PluginFunction<T> = (Vue: typeof _Vue, options?: T) => void; | ||
|
||
export interface PluginObject<T> { | ||
install: PluginFunction<T>; | ||
[key: string]: any; | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,136 @@ | ||
import { Vue } from "../vue.d"; | ||
import { ComponentOptions } from "../options.d"; | ||
|
||
interface Component extends Vue { | ||
a: number; | ||
} | ||
|
||
const Options: ComponentOptions = { | ||
data() { | ||
return { | ||
a: 1 | ||
} | ||
}, | ||
props: { | ||
size: Number, | ||
name: { | ||
type: String, | ||
default: 0, | ||
required: true, | ||
validator(value) { | ||
return value > 0; | ||
} | ||
} | ||
}, | ||
propsData: { | ||
msg: "Hello" | ||
}, | ||
computed: { | ||
aDouble(this: Component) { | ||
return this.a * 2; | ||
}, | ||
aPlus: { | ||
get(this: Component) { | ||
return this.a + 1; | ||
}, | ||
set(this: Component, v: number) { | ||
this.a = v - 1; | ||
}, | ||
cache: false | ||
} | ||
}, | ||
methods: { | ||
plus(this: Component) { | ||
this.a++; | ||
} | ||
}, | ||
watch: { | ||
'a': function(val: number, oldVal: number) { | ||
console.log(`new: ${val}, old: ${oldVal}`); | ||
}, | ||
'b': 'someMethod', | ||
'c': { | ||
handler(val: number, oldval: number) {}, | ||
deep: true | ||
} | ||
}, | ||
el: "#app", | ||
template: "<div>{{ message }}</div>", | ||
render(createElement) { | ||
return createElement("div", { | ||
attrs: { | ||
id: "foo" | ||
}, | ||
props: { | ||
myProp: "bar" | ||
}, | ||
domProps: { | ||
innerHTML: "baz" | ||
}, | ||
on: { | ||
click: new Function | ||
}, | ||
nativeOn: { | ||
click: new Function | ||
}, | ||
class: { | ||
foo: true, | ||
bar: false | ||
}, | ||
style: { | ||
color: 'red', | ||
fontSize: '14px' | ||
}, | ||
key: 'myKey', | ||
ref: 'myRef' | ||
}, [ | ||
createElement("div", {}, "message"), | ||
"message", | ||
[createElement("div", {}, "message")] | ||
]); | ||
}, | ||
staticRenderFns: [], | ||
|
||
beforeCreate() {}, | ||
created() {}, | ||
beforeDestroy() {}, | ||
destroyed() {}, | ||
beforeMount() {}, | ||
mounted() {}, | ||
beforeUpdate() {}, | ||
updated() {}, | ||
|
||
directives: { | ||
a: { | ||
bind() {}, | ||
update() {}, | ||
componentMounted() {}, | ||
unbind() {} | ||
}, | ||
b(el, binding, vnode, oldVnode) { | ||
el.textContent; | ||
|
||
binding.name; | ||
binding.value; | ||
binding.oldValue; | ||
binding.expression; | ||
binding.arg; | ||
binding.modifiers["modifier"]; | ||
} | ||
}, | ||
components: { | ||
a: Vue.component(""), | ||
b: {} as ComponentOptions | ||
}, | ||
transitions: {}, | ||
filters: { | ||
double(value: number) { | ||
return value * 2; | ||
} | ||
}, | ||
parent: new Vue, | ||
mixins: [Vue.component(""), ({} as ComponentOptions)], | ||
name: "Component", | ||
extends: {} as ComponentOptions, | ||
delimiters: ["${", "}"] | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,19 @@ | ||
import { Vue } from "../vue.d"; | ||
import { PluginFunction, PluginObject } from "../plugin.d"; | ||
|
||
class Option { | ||
prefix: string; | ||
suffix: string; | ||
} | ||
|
||
const plugin: PluginObject<Option> = { | ||
install(Vue, option) { | ||
if (typeof option !== "undefined") { | ||
const {prefix, suffix} = option; | ||
} | ||
} | ||
} | ||
const installer: PluginFunction<Option> = function(Vue, option) { } | ||
|
||
Vue.use(plugin, new Option); | ||
Vue.use(installer, new Option); |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,20 @@ | ||
{ | ||
"compilerOptions": { | ||
"target": "es5", | ||
"module": "commonjs", | ||
"noImplicitAny": true, | ||
"strictNullChecks": true, | ||
"noEmit": true | ||
}, | ||
"files": [ | ||
"../index.d.ts", | ||
"../options.d.ts", | ||
"../plugin.d.ts", | ||
"../vnode.d.ts", | ||
"../vue.d.ts", | ||
"options-test.ts", | ||
"plugin-test.ts", | ||
"vue-test.ts" | ||
], | ||
"compileOnSave": false | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,70 @@ | ||
import { Vue } from "../vue.d"; | ||
|
||
class Test extends Vue { | ||
testProperties() { | ||
this.$data; | ||
this.$el; | ||
this.$options; | ||
this.$parent; | ||
this.$root; | ||
this.$children; | ||
this.$refs; | ||
this.$slots; | ||
this.$isServer; | ||
} | ||
|
||
testMethods() { | ||
this.$mount("#app", false); | ||
this.$forceUpdate(); | ||
this.$destroy(); | ||
this.$set({}, "key", "value"); | ||
this.$delete({}, "key"); | ||
this.$watch("a", (val: number, oldVal: number) => {}, { | ||
immediate: true, | ||
deep: false | ||
})(); | ||
this.$watch(() => {}, (val: number) => {}); | ||
this.$on("", () => {}); | ||
this.$once("", () => {}); | ||
this.$off("", () => {}); | ||
this.$emit("", 1, 2, 3); | ||
this.$nextTick(function() { | ||
this.$nextTick; | ||
}); | ||
this.$createElement("div", {}, "message", ""); | ||
} | ||
|
||
static testConfig() { | ||
const { config } = this; | ||
config.silent; | ||
config.optionMergeStrategies; | ||
config.devtools; | ||
config.errorHandler = (err, vm) => { | ||
if (vm instanceof Test) { | ||
vm.testProperties(); | ||
vm.testMethods(); | ||
} | ||
}; | ||
config.keyCodes = { esc: 27 }; | ||
} | ||
|
||
static testMethods() { | ||
this.extend({ | ||
data() { | ||
return { | ||
msg: "" | ||
}; | ||
} | ||
}); | ||
this.nextTick(() => {}); | ||
this.set({}, "", ""); | ||
this.set([true, false, true], 1, true); | ||
this.delete({}, ""); | ||
this.directive("", {bind() {}}); | ||
this.filter("", (value: number) => value); | ||
this.component("", { data: () => ({}) }); | ||
this.use; | ||
this.mixin(Test); | ||
this.compile("<div>{{ message }}</div>"); | ||
} | ||
} |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,4 @@ | ||
{ | ||
"name": "vue", | ||
"main": "index.d.ts" | ||
} |
Oops, something went wrong.
Add this suggestion to a batch that can be applied as a single commit.
This suggestion is invalid because no changes were made to the code.
Suggestions cannot be applied while the pull request is closed.
Suggestions cannot be applied while viewing a subset of changes.
Only one suggestion per line can be applied in a batch.
Add this suggestion to a batch that can be applied as a single commit.
Applying suggestions on deleted lines is not supported.
You must change the existing code in this line in order to create a valid suggestion.
Outdated suggestions cannot be applied.
This suggestion has been applied or marked resolved.
Suggestions cannot be applied from pending reviews.
Suggestions cannot be applied on multi-line comments.
Suggestions cannot be applied while the pull request is queued to merge.
Suggestion cannot be applied right now. Please check back later.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Maybe a union type is suitable for ComponentOptions? One for functional component and another for normal components.
Also
render
can be even more strict if it is typed likerender(this: never, createElement: typeof Vue.prototype.$createElement, content: ContextObject)
. So users cannot accessthis
in functional components.There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
It's nice to make like
FunctionalComponentOptions
. This interface will tell us what properties are available / disable for functional components (Probably, lifecycle hooks anddata
are not available).