theluyuan/vue3-yuanma
1
0
Fork 0
Code Issues Pull Requests Packages Projects Releases Wiki Activity

chore: setup all packages

Browse Source
This commit is contained in:
Evan You
2018-09-19 12:26:50 -04:00
parent 898b1106c9
commit d1bc6ee8d6
36 changed files with 152 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

3
packages/runtime-dom/.npmignore
View File

@@ -1,3 +0,0 @@
__tests__/
__mocks__/
dist/packages

21
packages/runtime-dom/README.md
View File

@@ -1,21 +0,0 @@
# @vue/runtime-dom
``` js
import { h, render, Component } from '@vue/runtime-dom'
class App extends Component {
data () {
return {
msg: 'Hello World!'
}
}
render () {
return h('div', this.msg)
}
}
render(
h(App),
document.getElementById('app')
)
```

7
packages/runtime-dom/index.js
View File

@@ -1,7 +0,0 @@
'use strict'
if (process.env.NODE_ENV === 'production') {
module.exports = require('./dist/runtime-dom.cjs.prod.js')
} else {
module.exports = require('./dist/runtime-dom.cjs.js')
}

30
packages/runtime-dom/package.json
View File

@@ -1,30 +0,0 @@
{
"name": "@vue/runtime-dom",
"version": "3.0.0-alpha.1",
"description": "@vue/runtime-dom",
"main": "index.js",
"module": "dist/runtime-dom.esm.js",
"typings": "dist/index.d.ts",
"unpkg": "dist/runtime-dom.umd.js",
"buildOptions": {
"name": "Vue",
"formats": ["esm", "cjs", "umd", "esm-browser"]
},
"repository": {
"type": "git",
"url": "git+https://github.com/vuejs/vue.git"
},
"keywords": [
"vue"
],
"author": "Evan You",
"license": "MIT",
"bugs": {
"url": "https://github.com/vuejs/vue/issues"
},
"homepage": "https://github.com/vuejs/vue/tree/dev/packages/runtime-dom#readme",
"dependencies": {
"@vue/core": "3.0.0-alpha.1",
"@vue/scheduler": "3.0.0-alpha.1"
}
}

39
packages/runtime-dom/src/index.ts
View File

@@ -1,39 +0,0 @@
import {
h,
cloneVNode,
createPortal,
Component,
createRenderer
} from '@vue/core'
import { queueJob, nextTick } from '@vue/scheduler'
import { nodeOps } from './nodeOps'
import { patchData } from './patchData'
import { teardownVNode } from './teardownVNode'
const { render } = createRenderer({
queueJob,
nodeOps,
patchData,
teardownVNode
})
// important: inline the definition for nextTick
const publicNextTick = nextTick as (fn: Function) => Promise<void>
export { h, cloneVNode, createPortal, Component, render, publicNextTick as nextTick }
// also expose observer API
export {
autorun,
stop,
observable,
immutable,
computed,
isObservable,
isImmutable,
markImmutable,
markNonReactive,
unwrap
} from '@vue/core'

31
packages/runtime-dom/src/modules/attrs.ts
View File

@@ -1,31 +0,0 @@
export function patchAttr(
el: Element,
key: string,
value: any,
isSVG: boolean
) {
// isSVG short-circuits isXlink check
if (isSVG && isXlink(key)) {
if (value == null) {
el.removeAttributeNS(xlinkNS, getXlinkProp(key))
} else {
el.setAttributeNS(xlinkNS, key, value)
}
} else {
if (value == null) {
el.removeAttribute(key)
} else {
el.setAttribute(key, value)
}
}
}
const xlinkNS = 'http://www.w3.org/1999/xlink'
function isXlink(name: string): boolean {
return name.charAt(5) === ':' && name.slice(0, 5) === 'xlink'
}
function getXlinkProp(name: string): string {
return isXlink(name) ? name.slice(6, name.length) : ''
}

29
packages/runtime-dom/src/modules/class.ts
View File

@@ -1,29 +0,0 @@
// compiler should normlaize class + :class bindings on the same element
// into a single binding ['staticClass', dynamic]
export function patchClass(el: Element, value: any, isSVG: boolean) {
// directly setting className should be faster than setAttribute in theory
if (isSVG) {
el.setAttribute('class', normalizeClass(value))
} else {
el.className = normalizeClass(value)
}
}
function normalizeClass(value: any): string {
let res = ''
if (typeof value === 'string') {
res = value
} else if (Array.isArray(value)) {
for (let i = 0; i < value.length; i++) {
res += normalizeClass(value[i]) + ' '
}
} else if (typeof value === 'object') {
for (const name in value) {
if (value[name]) {
res += name + ' '
}
}
}
return res.trim()
}

142
packages/runtime-dom/src/modules/events.ts
View File

@@ -1,142 +0,0 @@
const delegateRE = /^(?:click|dblclick|submit|(?:key|mouse|touch).*)$/
type EventValue = Function | Function[]
type TargetRef = { el: Element | Document }
export function patchEvent(
el: Element,
name: string,
prevValue: EventValue | null,
nextValue: EventValue | null
) {
if (delegateRE.test(name)) {
handleDelegatedEvent(el, name, nextValue)
} else {
handleNormalEvent(el, name, prevValue, nextValue)
}
}
const eventCounts: Record<string, number> = {}
const attachedGlobalHandlers: Record<string, Function> = {}
export function handleDelegatedEvent(
el: any,
name: string,
value: EventValue | null
) {
const count = eventCounts[name]
let store = el.__events
if (value) {
if (!count) {
attachGlobalHandler(name)
}
if (!store) {
store = el.__events = {}
}
if (!store[name]) {
eventCounts[name]++
}
store[name] = value
} else if (store && store[name]) {
eventCounts[name]--
store[name] = null
if (count === 1) {
removeGlobalHandler(name)
}
}
}
function attachGlobalHandler(name: string) {
const handler = (attachedGlobalHandlers[name] = (e: Event) => {
const { type } = e
const isClick = type === 'click' || type === 'dblclick'
if (isClick && (e as MouseEvent).button !== 0) {
e.stopPropagation()
return false
}
e.stopPropagation = stopPropagation
const targetRef: TargetRef = { el: document }
Object.defineProperty(e, 'currentTarget', {
configurable: true,
get() {
return targetRef.el
}
})
dispatchEvent(e, name, isClick, targetRef)
})
document.addEventListener(name, handler)
eventCounts[name] = 0
}
function stopPropagation() {
this.cancelBubble = true
if (!this.immediatePropagationStopped) {
this.stopImmediatePropagation()
}
}
function dispatchEvent(
e: Event,
name: string,
isClick: boolean,
targetRef: TargetRef
) {
let el = e.target as any
while (el != null) {
// Don't process clicks on disabled elements
if (isClick && el.disabled) {
break
}
const store = el.__events
if (store) {
const value = store[name]
if (value) {
targetRef.el = el
invokeEvents(e, value)
if (e.cancelBubble) {
break
}
}
}
el = el.parentNode
}
}
function invokeEvents(e: Event, value: EventValue) {
if (Array.isArray(value)) {
for (let i = 0; i < value.length; i++) {
value[i](e)
}
} else {
value(e)
}
}
function removeGlobalHandler(name: string) {
document.removeEventListener(name, attachedGlobalHandlers[name] as any)
eventCounts[name] = 0
}
function handleNormalEvent(el: Element, name: string, prev: any, next: any) {
const invoker = prev && prev.invoker
if (next) {
if (invoker) {
prev.invoker = null
invoker.value = next
next.invoker = invoker
} else {
el.addEventListener(name, createInvoker(next))
}
} else if (invoker) {
el.removeEventListener(name, invoker)
}
}
function createInvoker(value: any) {
const invoker = ((e: Event) => {
invokeEvents(e, invoker.value)
}) as any
invoker.value = value
value.invoker = invoker
return invoker
}

18
packages/runtime-dom/src/modules/props.ts
View File

@@ -1,18 +0,0 @@
import { VNode, ChildrenFlags } from '@vue/core'
export function patchDOMProp(
el: any,
key: string,
value: any,
prevVNode: VNode,
unmountChildren: any
) {
if (key === 'innerHTML' || key === 'textContent') {
if (prevVNode && prevVNode.children) {
unmountChildren(prevVNode.children, prevVNode.childFlags)
prevVNode.children = null
prevVNode.childFlags = ChildrenFlags.NO_CHILDREN
}
}
el[key] = value
}

54
packages/runtime-dom/src/modules/style.ts
View File

@@ -1,54 +0,0 @@
import { isObservable } from '@vue/core'
// style properties that should NOT have "px" added when numeric
const nonNumericRE = /acit|ex(?:s|g|n|p|$)|rph|ows|mnc|ntw|ine[ch]|zoo|^ord/i
export function patchStyle(el: any, prev: any, next: any, data: any) {
// If next is observed, the user is likely to mutate the style object.
// We need to normalize + clone it and replace data.style with the clone.
if (isObservable(next)) {
data.style = normalizeStyle(next)
}
const { style } = el
if (!next) {
el.removeAttribute('style')
} else if (typeof next === 'string') {
style.cssText = next
} else {
// TODO: warn invalid value in dev
next = normalizeStyle(next)
for (const key in next) {
let value = next[key]
if (typeof value === 'number' && !nonNumericRE.test(key)) {
value = value + 'px'
}
style.setProperty(key, value)
}
if (prev && typeof prev !== 'string') {
prev = normalizeStyle(prev)
for (const key in prev) {
if (!next[key]) {
style.setProperty(key, '')
}
}
}
}
}
function normalizeStyle(value: any): Record<string, string | number> | void {
if (value && typeof value === 'object') {
return value
} else if (Array.isArray(value)) {
const res: Record<string, string | number> = {}
for (let i = 0; i < value.length; i++) {
const normalized = normalizeStyle(value[i])
if (normalized) {
for (const key in normalized) {
res[key] = normalized[key]
}
}
}
return res
}
}

39
packages/runtime-dom/src/nodeOps.ts
View File

@@ -1,39 +0,0 @@
const svgNS = 'http://www.w3.org/2000/svg'
export const nodeOps = {
createElement: (tag: string, isSVG?: boolean): Element =>
isSVG ? document.createElementNS(svgNS, tag) : document.createElement(tag),
createText: (text: string): Text => document.createTextNode(text),
setText: (node: Text, text: string) => {
node.nodeValue = text
},
appendChild: (parent: Node, child: Node) => {
parent.appendChild(child)
},
insertBefore: (parent: Node, child: Node, ref: Node) => {
parent.insertBefore(child, ref)
},
replaceChild: (parent: Node, oldChild: Node, newChild: Node) => {
parent.replaceChild(newChild, oldChild)
},
removeChild: (parent: Node, child: Node) => {
parent.removeChild(child)
},
clearContent: (node: Node) => {
node.textContent = ''
},
parentNode: (node: Node): Node | null => node.parentNode,
nextSibling: (node: Node): Node | null => node.nextSibling,
querySelector: (selector: string): Node | null =>
document.querySelector(selector)
}

42
packages/runtime-dom/src/patchData.ts
View File

@@ -1,42 +0,0 @@
import { VNode } from '@vue/core'
import { patchClass } from './modules/class'
import { patchStyle } from './modules/style'
import { patchAttr } from './modules/attrs'
import { patchDOMProp } from './modules/props'
import { patchEvent } from './modules/events'
export function patchData(
el: Element,
key: string,
prevValue: any,
nextValue: any,
prevVNode: VNode,
nextVNode: VNode,
isSVG: boolean,
unmountChildren: any
) {
switch (key) {
// special
case 'class':
patchClass(el, nextValue, isSVG)
break
case 'style':
patchStyle(el, prevValue, nextValue, nextVNode.data)
break
default:
if (key.startsWith('on')) {
patchEvent(el, key.toLowerCase().slice(2), prevValue, nextValue)
} else if (key.startsWith('domProps')) {
patchDOMProp(
el,
key[8].toLowerCase() + key.slice(9),
nextValue,
prevVNode,
unmountChildren
)
} else {
patchAttr(el, key, nextValue, isSVG)
}
break
}
}

13
packages/runtime-dom/src/teardownVNode.ts
View File

@@ -1,13 +0,0 @@
import { VNode } from '@vue/core'
import { handleDelegatedEvent } from './modules/events'
export function teardownVNode(vnode: VNode) {
const { el, data } = vnode
if (data != null) {
for (const key in data) {
if (key.startsWith('on')) {
handleDelegatedEvent(el, key.toLowerCase().slice(2), null)
}
}
}
}