How to properly throw an error in Vue.js?

Question

I am building an SVG component 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 compiler 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?

Answer 1

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