CODEWITHSUNDEEP
javascripttypescriptvue.js
Emmanuel
Emmanuel

Reputation: 77

Why do I see TypeScript in Vue.js source code?

I went through the vue.js source code just to have a look, and I saw some strange code, which I learnt was TypeScript syntax after some research. My problem is, this syntax is in a ".js" file, which I don't understand because I know TypeScript files (.ts) should compile to pure JS. So why do I still see the type annotation in the function parameter in a .js file?

function hasAncestorData (node: VNode) {
  const parentNode = node.parent
  return isDef(parentNode) && (isDef(parentNode.data) || hasAncestorData(parentNode))
}

Upvotes: 2

Views: 250

Answers (1)

Mateusz Kocz
Mateusz Kocz

Reputation: 4602

This is actually a Flow code. You can see the /* @flow */ comment at the beginning of some files that enables the tool's type checking. It's a bit similar to TypeScript, but those are not the same things.

A quick look through the src folder of the Vue.js github repo shows that they do indeed use .js for their JavaScript w/Flow code, for instance in src/core/vdom/create-component.js:

const componentVNodeHooks = {
  init (vnode: VNodeWithData, hydrating: boolean): ?boolean {

But if we look in the dist folder, we can see that those Flow type annotations have been removed for distribution. For instance, here's the above in dist/vue.js (that line number will rot over time):

var componentVNodeHooks = {
  init: function init (vnode, hydrating) {

Upvotes: 8

Related Questions