Vue is now no longer displaying errors in the console

Something strange is happening while I'm debugging a Vue/Nuxt app. Suddenly, the errors in the console have disappeared whenever my Javascript references a function or variable that doesn't exist. Instead of showing an error, it just fails silently. An example of this:

methods: {
    foo() {
        doesNotExist();
    }
}

When I try to call foo(), nothing happens, whether I'm using Firefox or Chrome. Previously, I would see an error message in the console.

I am not sure if this issue is related to Vue, Nuxt, or just plain old Javascript.

What could I have done to cause this unexpected behavior?

javascriptvue.jsnuxt.js

Answer №1

You might want to consider:

methods: {
bar: function() {
    funcNotFound();
}

In my opinion, utilizing TypeScript with frameworks like Vue is highly recommended. TypeScript is a statically-typed language that compiles into JavaScript (dynamically-typed), making the debugging process much simpler. It can identify errors directly within your code editor, such as VSCode, eliminating the need to debug using browser devtools.

Answer №2

Be sure to choose Custom Levels -> Errors in the developer console for accurate feedback:

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Is there a way to include two functions within a single ng-click event?

Is it possible to incorporate two functions in a single ng-click event? Below is the code snippet: <button class="cButtonSpeichern" ng-click="saveUser()">Speichern</button> In addition, I would like to include this function as well. alert ...

javascriptangularjshtml

The byte order of integer literals in JavaScript

When writing the following line in Javascript: var n = 0x1234, is it always true that n == 4660? This question could also be phrased as follows: Does 0x1234 represent a series of bytes with 0x12 as the first byte and 0x34 as the last byte? Or does 0x1234 r ...

javascriptintegerendiannessliterals

At what point in the lifecycle of my component am I able to begin using this.$refs?

Exploring ways to integrate HTML5 audio events while initializing a Vue.js component that consists of a single file: <template> <audio ref="player" v-bind:src="activeStationUrl" v-if="activeStationUrl" controls autoplay></audio> < ...

javascripthtmlvue.jshtml5-audio

TypeORM reporting duplication error when bulk saving data instead of detecting and ignoring existing records or updating their values

According to the documentation provided by TypeOrm Framework, the Repository.save function is supposed to save/insert new values and ignore/update existing ones. However, I am currently experiencing an issue where it is throwing a duplication error for an ...

javascriptmysqltypescriptnestjstypeorm

VueJS keeps an eye on properties to dynamically update data

Imagine having three different fields: https://i.sstatic.net/1cIR1.jpg The value should be modified when either the percentage or total changes. Total should update whenever the value is altered. To accomplish this, I set up some watchers for these prop ...

vue.jsvuejs2

What is the best way to showcase the following values using Vue.js?

{"status":true,"data":[{"ref_id":"22","agent_id":"68","p_id":"84","description":"i am interested"},{"ref_id":"24","agent_id":"68","p_id":"84","description":"For more information about Bootstrap and Bootstrap Glyphicons, visit our Bootstrap Tutorial.For mor ...

javascriptphphtmlvue.js

In Safari, there seems to be an issue where multiple URLs are not opening when clicked on from an anchor

Is there a way to open multiple URLs in Safari with just one click using window.open? I tried it, but only one URL opens in a new tab while the others do not. The version of Safari I am using is 11.0.1. onclick="window.open('URL1','_blank& ...

javascriptjqueryhtmlsafari

Is it possible to achieve real-time two-way data binding in a reactive form by passing values from one formgroup to another formgroup? If so, how

There are 2 FormGroups named orderForm and parcelForm on a page. The parcelForm is generated dynamically within a FormArray. In the parcelForm, there are FormControls like net_weight and gross_weight, while the OrderForm has FormControls such as total_net_ ...

javascripttypescriptionic4angular8angular-reactive-forms

Emphasize the search term "angular 2"

A messenger showcases the search results according to the input provided by the user. The objective is to emphasize the searched term while displaying the outcome. The code snippets below illustrate the HTML and component utilized for this purpose. Compon ...

javascriptangularhtmltypescript

How to filter jQuery DataTables by column using comparison operators

Recently, I've been utilizing the amazing DataTables jQuery plugin along with the filter plug in. But now, I find myself pondering if there's a way to filter table columns by row using a comparison operator (such as '<', '>&a ...

javascriptjqueryjquery-pluginsfilteringdatatables

How to pass the Node environment to layout.jade in Express without explicitly specifying the route

Passing parameters to Jade files seems like a piece of cake: app.use('/myroute', function (req, res) { res.render('myview', {somevar: 'Testing!'}); }); But, I have my layout.jade file that is automatically read and rendere ...

javascriptnode.jsexpresspug

Want to learn about Google Apps Script Web App? Join us to dive into AJAX, leverage

I'm attempting to follow the steps outlined in "Example 3: Web Response" on "this SparkFun tutorial" After implementing the code on script.google.com, I encountered an issue where I couldn't see the pin readings. Can someone provide assistance w ...

javascriptjqueryajaxjsongoogle-apps-script

Extract the color of an individual character

There is a code snippet in JavaScript using p5.js that functions as a video filter: const density = ' .:░▒▓█' //const density = ' .tiITesgESG' //let geist; let video let asciiDiv let playing = false let ...

javascripthtmlcssprocessingp5.js

Adding an element in real-time to a sortable list item using VueJs

I'm working on a project with a sortable list and I have two main goals: To be able to add/remove LI elements from the list using a +/- symbol. The list includes a textarea with data - my challenge is storing this data properly when adding or removin ...

vue.jsvue-componentvuetify.js

Enable autocomplete feature in a PHP form once the user starts typing their name

After searching for similar questions, I couldn't find any with the same "variables," so here's my dilemma: I have a basic form where I input a name and I want the rest of the form to be filled in automatically (ID). Retrieving data from the da ...

javascriptphpjqueryajaxautocomplete

Creating personalized tags or components by utilizing insertAdjacentHTML in Vue

With the use of insertAdjacentHTML, I am able to create HTML elements such as div and span, but it seems that I cannot generate custom tags like <myComponent> </myComponent>. I understand that insertAdjacentHTML can create HTML elements, but a ...

javascripthtmlvue.js

Take action upon window.open

I have a code snippet here that opens a window. Is it possible to make an ajax call when this window is opened? window.open("http://www.google.com"); For instance, can I trigger the following ajax call once the window is open: var signalz = '1&apos ...

javascriptjquery

Comparing JSON objects with JavaScript models: A guide

Currently I'm working with angular 2 and I have an array of data. data: MyModel[] = [ { id: 1, name: 'Name', secondName: 'SecondName' } In addition, I have created the interface MyModel: interface MyModel { id: number, nam ...

javascriptjsonangulartypescript

A JavaScript pop-up box with two windows

Struggling to create two separate dialog boxes using this code. The issue is that when I add the code for the second dialog box, it only appears if the first one does too. Here's the code for the first dialog: function showPopUp(el) { var ...

javascripthtml

Working with VueJS v-for directive inside Laravel Blade template

Is there a way to create a list in Laravel (v7) Blade using VueJS v-for method? In home.blade.php: <template v-for="(item,index) in this.list"> <qm-item number="@{{index}}"></qm-item> </template> When checking the source code ...

laravelvue.js