Livereload in Gulp fails to automatically restart the server

How can I make my gulp+livereload server automatically restart and update the page when JS files are changed?

Below is a snippet from my gulpfile.js:

var gulp        = require('gulp'),
    livereload  = require('gulp-livereload'),
    watch       = require('gulp-watch'),
    express     = require('express'),
    app         = express(),
    path        = require('path'),
    server      = tinylr();

 ...
gulp.task('js', function() {
  return gulp.src([
  'app/scripts/*.js',
    ])
    .pipe( concat('combined.js'))
    .pipe( gulp.dest('../dist/app/js/'))
    .pipe( livereload( server ));
});

gulp.task('watch', function () {
...
  gulp.watch(['app/scripts/*.js'],['js']);   
});

Answer №1

Remember to utilize livereload.reload() in place of just livereload(). Also, ensure you have installed the browser extension and added the livereload script to your page (typically with src="//localhost:35729/livereload.js?snipver=1")

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

Producing asynchronous JavaScript events using a browser extension (NPAPI)

Currently in the process of developing a web browser plugin using NPAPI. The issue I am facing is that my plugin requires a worker thread to handle certain tasks, and I need to pass events back to JavaScript as the worker progresses. However, due to the N ...

How should the nonce be properly set in the csp policy?

I've been attempting to incorporate a nonce into the csp policy but it's not functioning as anticipated. Here's the code snippet I'm currently using for testing purposes: server.js express.use(function(req, res, next) { res.set( ...

Challenge with Updating React Components When Switching Themes

In my React application, I'm facing a challenge with theme switching. There are two themes available: Theme One and Theme Two. To dynamically load theme components, lazy loading has been implemented based on the selected theme. Each theme has its own ...

Expressing the differentiation between routes

In order to avoid a lengthy list of routes in my routes.js file, I decided to create a new folder named routes and move the routes.js file into it. I then renamed the file to index.js. My goal is to have separate files for different categories of routes. B ...

Is there a beginner's pack or trial version available for utilizing TypeScript with IBM Cloud Functions / OpenWhisk?

While working on developing actions in IBM Cloud Functions, I have been primarily using Node.js / Javascript and Python for coding. However, I haven't come across specific instructions on how to incorporate TypeScript into IBM Cloud Functions. I am c ...

Issue with Sequelize migration due to unsupported dialect error with Object Object

Overview In the process of creating a standard Express application, I have successfully set up a database connection using pg and sequelize. However, when attempting to execute sequelize db:migrate with the CLI, an error occurs: ERROR: The dialect [obj ...

Simple JavaScript validation for inputting names

Hey there, I'm a beginner in javascript and I am struggling with a simple input validation using else if statements. Every time I run the code, it goes directly to the else condition. Can someone please assist me? <!DOCTYPE html> <html lang=& ...

Difficulty establishing audio calls with Internet Explorer using PeerJS

I successfully implemented a user-to-user audio call system by following the steps outlined in this guide: The system is up and running flawlessly on my website while using Google Chrome. However, I encountered an issue when trying to connect to a user o ...

How many documents are stored in MongoDB in total?

Seeking assistance with mongodb, as I am a newcomer to it and trying to determine the total number of records in a collection while utilizing node express. Here is my code snippet: let mongoose = require('mongoose'); let Patient = require(&apos ...

Generating views for individual models in a backbone collection

Currently, I am developing a small backbone.js application that simulates a library where CRUD operations can be performed. The core components of this application are the book model and the library collection (which stores books). var Book = Backbone.Mod ...

The absence of data in a c# web api controller is causing issues with jQuery AJAX post requests

When I am sending data to a c# web api controller, I use the following method: $.ajax({ type: "POST", url: "menuApi/menu/Cost", data: JSON.stringify(order), contentType: "application/json", success: function (data) { window.alert(&apo ...

Obtaining the initial value from an Observable in Angular 8+

Initially, I have a page form with preset values and buttons for navigating to the next or previous items. Upon initialization in ngOnInit, an observable provides me with a list of 3 items as the starting value - sometimes it may even contain 4 items. Ho ...

The CSS selectors wrapped in jQuery vary between Chrome and Internet Explorer 11

When utilizing a jquery wrapped css selector such as $($("#selector").find('input[type="textarea"])'), I am able to input values into the textarea in Chrome using $($("#selector").find('input[type="textarea"]).val(someValue)') but encou ...

The type string[] cannot be assigned to type 'IntrinsicAttributes & string[]'

I'm attempting to pass the prop of todos just like in this codesandbox, but encountering an error: Type '{ todos: string[]; }' is not assignable to type 'IntrinsicAttributes & string[]'. Property 'todos' does not ex ...

Exploring the use of the caret symbol (^) for exponentiation

I am embarking on a project to develop an uncomplicated graphing calculator that enables users to input a function of f (such as f(x) = x^2+2x+6). Essentially, the JavaScript code should replace the x in the function with a specific number and then compute ...

Is it acceptable to assign unique names to individual arrays within a multidimensional array?

I was curious about the possibility of naming arrays within a multi-array, similar to how it can be done with individual arrays. For example: var cars = new Array(); cars[0] = "Saab"; cars[1] = "Volvo"; cars[2] = "BMW"; I was wondering if there was a way ...

Rails 7 is missing the Toast element from Bootstrap 5

Having some trouble with implementing Bootstrap 5 Toast in Rails 7 for flash messages. Here is the code I am currently using: # application.html.erb <head> ... <%= javascript_importmap_tags %> <script> const toastElList = document.que ...

The server appears to be active, but there is a lack of content rendering when using React, Node

When I attempt to run the code in app.jsx, nothing displays even though the index.html is functioning properly. Code from Server.js: var express = require('express'); server.js page var app = express(); app.use(express.static('public' ...

Is it possible for a jQuery ajaxSuccess function to detect an AJAX event in a separate JavaScript file? If it is, what steps am I missing?

I've been attempting to initiate a function following an ajax event. I have been informed that despite the ajax event occurring in a different file (on the same server, if that makes a difference) and that the file is javascript, not jquery, "Ajaxsucc ...

- How does Routing in React compare to Routing in Express?

I am struggling to grasp the distinction between routing in frontend and backend applications. From what I understand, React-router assigns components to specific URLs like this: <Router> <div> <Header /> <R ...