I am building an SVG ponent that takes a filename without extension. I want to force this and throw an error if the extension is used though.

Since I have a ES6 piler I am simply using this:

if (this.name.includes('.svg')) {
    throw 'Do not use the svg extension';
}

Is this a proper way to throw an error in Vue.js or is there a better way? Currently I am getting 2 warnings when I implement this and test it out.

I am getting a [Vue warn] with stacktrace and my own error. Preferably I would just like to throw a simply error message in the console to signify what a user did wrong.

Any thoughts on this approach or tips to handle this better in Vue.js or javscript in general?

I am building an SVG ponent that takes a filename without extension. I want to force this and throw an error if the extension is used though.

Since I have a ES6 piler I am simply using this:

if (this.name.includes('.svg')) {
    throw 'Do not use the svg extension';
}

Is this a proper way to throw an error in Vue.js or is there a better way? Currently I am getting 2 warnings when I implement this and test it out.

I am getting a [Vue warn] with stacktrace and my own error. Preferably I would just like to throw a simply error message in the console to signify what a user did wrong.

Any thoughts on this approach or tips to handle this better in Vue.js or javscript in general?

• javascript
• vue.js
• vuejs2
• vue-ponent

• 1 That is a correct approach I think, the [vue warn] you are getting is just more specific about the error you throw mentioning when the error originated including your ponent name. – Vamsi Krishna Commented May 18, 2017 at 10:15

2 Answers 2

You should use the standard TypeError:

Creates an instance representing an error that occurs when a variable or parameter is not of a valid type.

throw new TypeError("Do not use the svg extension", filename)

TypeError-MDN

When Error is used like a function -- without new, it will return an Error object. Therefore, a mere call to Error will produce the same output that constructing an Error object via the new keyword would.

throw new Error('Error text.');

Besides the generic Error constructor, there are seven other core error constructors in JavaScript. For client-side exceptions, see Exception handling statements.

EvalError Creates an instance representing an error that occurs regarding the global function eval().

InternalError Creates an instance representing an error that occurs when an internal error in the JavaScript engine is thrown. E.g. "too much recursion".

RangeError Creates an instance representing an error that occurs when a numeric variable or parameter is outside of its valid range. ReferenceError Creates an instance representing an error that occurs when de-referencing an invalid reference.

SyntaxError Creates an instance representing a syntax error that occurs while parsing code in eval().

TypeError Creates an instance representing an error that occurs when a variable or parameter is not of a valid type.

URIError Creates an instance representing an error that occurs when encodeURI() or decodeURI() are passed invalid parameters.