diff --git a/packages/core/src/componentProps.ts b/packages/core/src/componentProps.ts index 936f733d..7a4e7897 100644 --- a/packages/core/src/componentProps.ts +++ b/packages/core/src/componentProps.ts @@ -8,6 +8,7 @@ import { PropType } from './componentOptions' import { EMPTY_OBJ, camelize, hyphenate, capitalize } from './utils' +import { warn } from './warning' const EMPTY_PROPS = { props: EMPTY_OBJ } @@ -159,13 +160,13 @@ function normalizePropsOptions( if (Array.isArray(raw)) { for (let i = 0; i < raw.length; i++) { if (__DEV__ && typeof raw !== 'string') { - console.warn(`props must be strings when using array syntax.`) + warn(`props must be strings when using array syntax.`) } normalized[camelize(raw[i])] = EMPTY_OBJ } } else { if (__DEV__ && typeof raw !== 'object') { - console.warn(`invalid props options: `, raw) + warn(`invalid props options`, raw) } for (const key in raw) { const opt = raw[key] @@ -224,7 +225,7 @@ function validateProp( const { type, required, validator } = prop // required! if (required && isAbsent) { - console.warn('Missing required prop: "' + name + '"') + warn('Missing required prop: "' + name + '"') return } // missing but optional @@ -243,15 +244,13 @@ function validateProp( isValid = valid } if (!isValid) { - console.warn(getInvalidTypeMessage(name, value, expectedTypes)) + warn(getInvalidTypeMessage(name, value, expectedTypes)) return } } // custom validator if (validator && !validator(value)) { - console.warn( - 'Invalid prop: custom validator check failed for prop "' + name + '".' - ) + warn('Invalid prop: custom validator check failed for prop "' + name + '".') } } diff --git a/packages/core/src/componentUtils.ts b/packages/core/src/componentUtils.ts index d50a0dee..2950f67c 100644 --- a/packages/core/src/componentUtils.ts +++ b/packages/core/src/componentUtils.ts @@ -20,6 +20,7 @@ import { initializeWatch, teardownWatch } from './componentWatch' import { ComponentOptions } from './componentOptions' import { createRenderProxy } from './componentProxy' import { handleError, ErrorTypes } from './errorHandling' +import { warn } from './warning' let currentVNode: VNode | null = null let currentContextVNode: MountedVNode | null = null @@ -244,7 +245,7 @@ export function createComponentClassFromOptions( } else if (key === 'methods') { for (const method in value) { if (__DEV__ && proto.hasOwnProperty(method)) { - console.warn( + warn( `Object syntax contains method name that conflicts with ` + `lifecycle hook: "${method}"` ) diff --git a/packages/core/src/componentWatch.ts b/packages/core/src/componentWatch.ts index 5abbc62e..79aa47e7 100644 --- a/packages/core/src/componentWatch.ts +++ b/packages/core/src/componentWatch.ts @@ -4,6 +4,7 @@ import { ComponentWatchOptions, WatchOptions } from './componentOptions' import { autorun, stop } from '@vue/observer' import { queueJob } from '@vue/scheduler' import { handleError, ErrorTypes } from './errorHandling' +import { warn } from './warning' export function initializeWatch( instance: ComponentInstance, @@ -40,7 +41,7 @@ export function setupWatcher( : () => keyOrFn.call(proxy) if (__DEV__ && rawGetter === NOOP) { - console.warn( + warn( `Failed watching expression: "${keyOrFn}". ` + `Watch expressions can only be dot-delimited paths. ` + `For more complex expressions, use $watch with a function instead.` diff --git a/packages/core/src/h.ts b/packages/core/src/h.ts index d56950ef..2b28ae52 100644 --- a/packages/core/src/h.ts +++ b/packages/core/src/h.ts @@ -10,6 +10,7 @@ import { createPortal } from './vdom' import { isObservable } from '@vue/observer' +import { warn } from './warning' export const Fragment = Symbol() export const Portal = Symbol() @@ -79,14 +80,12 @@ export const h = ((tag: ElementType, data?: any, children?: any): VNode => { ) } else if (tag === Fragment) { if (__DEV__ && ref) { - console.warn( - 'Ref cannot be used on Fragments. Use it on inner elements instead.' - ) + warn('Ref cannot be used on Fragments. Use it on inner elements instead.') } return createFragment(children, ChildrenFlags.UNKNOWN_CHILDREN, key) } else if (tag === Portal) { if (__DEV__ && !portalTarget) { - console.warn('Portal must have a target: ', portalTarget) + warn('Portal must have a target: ', portalTarget) } return createPortal( portalTarget, @@ -100,7 +99,7 @@ export const h = ((tag: ElementType, data?: any, children?: any): VNode => { __DEV__ && (!tag || (typeof tag !== 'function' && typeof tag !== 'object')) ) { - console.warn('Invalid component passed to h(): ', tag) + warn('Invalid component passed to h(): ', tag) } // component return createComponentVNode( diff --git a/packages/core/src/optional/context.ts b/packages/core/src/optional/context.ts index 595972f4..6ab92fac 100644 --- a/packages/core/src/optional/context.ts +++ b/packages/core/src/optional/context.ts @@ -1,5 +1,6 @@ import { observable } from '@vue/observer' import { Component } from '../component' +import { warn } from '../warning' const contextStore = observable() as Record @@ -28,14 +29,12 @@ export class Provide extends Component { if (__DEV__) { const { id } = this.$props if (contextStore.hasOwnProperty(id)) { - console.warn( - `A context provider with id ${id.toString()} already exists.` - ) + warn(`A context provider with id ${id.toString()} already exists.`) } this.$watch( () => this.$props.id, (id: string, oldId: string) => { - console.warn( + warn( `Context provider id change detected (from "${oldId}" to "${id}"). ` + `This is not supported and should be avoided.` ) diff --git a/packages/core/src/optional/keepAlive.ts b/packages/core/src/optional/keepAlive.ts index ec95e655..664b1777 100644 --- a/packages/core/src/optional/keepAlive.ts +++ b/packages/core/src/optional/keepAlive.ts @@ -1,6 +1,7 @@ import { Component, ComponentClass, ComponentInstance } from '../component' import { VNode, Slots, cloneVNode } from '../vdom' import { VNodeFlags } from '../flags' +import { warn } from '../warning' type MatchPattern = string | RegExp | string[] | RegExp[] @@ -57,12 +58,12 @@ export class KeepAlive extends Component { let vnode = children[0] if (children.length > 1) { if (__DEV__) { - console.warn(`KeepAlive can only have a single child.`) + warn(`KeepAlive can only have a single child.`) } return children } else if ((vnode.flags & VNodeFlags.COMPONENT_STATEFUL) === 0) { if (__DEV__) { - console.warn(`KeepAlive child must be a stateful component.`) + warn(`KeepAlive child must be a stateful component.`) } return children } diff --git a/packages/core/src/warning.ts b/packages/core/src/warning.ts index 32ed0616..22ab6bed 100644 --- a/packages/core/src/warning.ts +++ b/packages/core/src/warning.ts @@ -12,15 +12,15 @@ export function popContext() { stack.pop() } -export function warn(msg: string) { +export function warn(msg: string, ...args: any[]) { // TODO warn handler? - console.warn(`[Vue warn]: ${msg}${getComponentTrace()}`) + warn(`[Vue warn]: ${msg}${getComponentTrace()}`, ...args) } function getComponentTrace(): string { let current: VNode | null | undefined = stack[stack.length - 1] if (!current) { - return '\nat ' + return '' } // we can't just use the stack because it will be incomplete during updates