when I try to run using gulp command, it starts running, but quits after that. How can I make it work as a server?
admins-MacBook-Pro:javascript tester$ ls
bower.json bower_components gulpfile.js lib node_modules package.json
admins-MacBook-Pro:javascript tester$ gulp
[14:37:21] Using gulpfile ~/Documents/cakeshop/cakeshop-client-js/src/main/javascript/gulpfile.js
[14:37:21] Starting 'compile-libs'...
[14:37:21] Starting 'compile-combined'...
[14:37:21] Finished 'compile-libs' after 253 ms
[14:37:24] Finished 'compile-combined' after 3.28 s
[14:37:24] Starting 'compile'...
[14:37:24] Finished 'compile' after 27 μs
[14:37:24] Starting 'default'...
[14:37:24] Finished 'default' after 4.86 μs
admins-MacBook-Pro:javascript tester$
When you just run gulp, the default task is run. According to your output, the default task for your gulpfile depends on the compile-libs, compile-combined, and compile tasks, so those are executed in order.
The available tasks are defined in the gulpfile.js and as such are subject to your particular projects. We cannot tell you whether there is a development server task included or not, and we cannot tell you what it is called either.
You can get a list of available gulp tasks using gulp --tasks. Maybe you can spot a task that starts a server for you; you can then start that using e.g. gulp server. If there is no such task, you will have to write your own, setting up your own server.
Related
In an AngularJS 1.7 project, I've managed to migrate my gulp configuration files from 3.9 to 4.0.2, but the http server won't start with a "gulp serve"
I've :
Converted all the dependencies to a "series" task. I used series everywhere, as I think it's safer (and slower) than using parallel execution.
gulp.task('default', ['clean'], function () {
gulp.start('build');
});
to
gulp.task('default', gulp.series(['clean']), function () {
gulp.start('build');
});
Reorder the require('./gulp/somefile.js') manually so that tasks are defined before being called. (before it was loaded by a loop)
within each files put the function definition before the task call them
When I do a "gulp serve", I can see the build output showing the same 'normal' errors I had before migration (non angularjs lib added manually), and some new warning from bootstrap-sass about deprecated division.
After the build part, I would expect a local server to start on port 3000, Chrome being launched with the web UI i'm developping being displayed and my REST call being proxied to a local apache/php server, but well, it doesn't start, no error/warning, nothing.
[00:41:33] Finished 'styles' after 1.6 s
[00:41:33] Finished 'inject' after 2.31 s
[00:41:33] Finished 'watch' after 2.31 s
[00:41:33] Finished 'serve' after 2.31 s
The configuration files are here : https://github.com/dev-mansonthomas/RedCrossQuest/tree/ComposerLibUpdate/client
gulp.js
and then all files in the gulp sub directory.
gulp.start was never really intended for end users and is unneccesary with gulp.series. I wouldn't doubt support for it was removed from v4. Just use:
gulp.task('default', gulp.series('clean', 'build'));
I have the following project structure (monorepo with many packages)
/pkgA
gulpfile.js
/pkgB
gulpfile.js
/pkgC
gulpfile.js
Each package has a gulpfile.js which just loads /shared/shared-gulp-tasks.js
Important: we want to keep this independence (so that I can run gulp whatever only for a given package, if wanted) - i.e. I don't want to remove the existing tasks from the shared gulpfile, I want to reuse them.
If we want to build everything at once, we run a task synchronously like this:
bash for-each-package.sh "gulp package"
Which does something like
cd pkgA
gulp package
cd pkgB
gulp package
cd pkgC
gulp package
However this is slow, because I start gulp executable from scratch for each package, and it takes ~3 seconds every time to load gulp and all the needed deps. (we have 20+ subpackages).
What I want is to have a task defined in gulpfile.js in the root which would let me do
gulp package-all
The code would look like this:
gulp.task('package-all', function(done) {
['pkgA', 'pkgB', 'pkgC'].forEach(function(pkgName) {
process.chdir(path.join(__dirname, pkgName));
// need to run 'package' task here, synchronously
// gulp.start('package'); is async
});
done();
}
Note that folder-specific package task is already declared in shared gulpfile and I don't want to rewrite it.
The problem is that I want to do this synchronously, and when all folders are finished processing, call done().
Options explored so far:
gulp.run is deprecated, gulp.start is undocumented, generally not advised
and they don't work in this case (they are async)
runSequence looks promising, but how would I run same task many times, per-folder, with cd to that folder before
I am aware that what I ask is kind-of orthogonal to "the gulp way" but I don't want to rewrite all my tasks.
What can be a good way to achieve my goals?
Finally I solved the issue by using run-sequence and creating fake tasks (not sure if there's an easier way - BTW it seems that gulp tasks can not be anonymous, you can't just pass functions to run-sequence, you need to pass string names of registered gulp tasks) and then a sequence out of those tasks (and passing done at the end of the sequence).
gulpfile.js
var runSequence = require('run-sequence');
var gulp = require('gulp');
require('./shared-gulp-tasks')(gulp);
var folders = ['pkgA', 'pkgB', 'pkgC']; // this array comes from external helper method which reads it from disk
function registerTaskForAllFolders(wrappedTaskName) {
var tasksToExecute = [];
folders.forEach(function(folderName) {
var taskName = wrappedTaskName + '_' + folderName;
gulp.task(taskName, function(done) {
console.log(folderName);
process.chdir(path.join(__dirname, folderName));
runSequence(wrappedTaskName, done);
});
tasksToExecute.push(taskName);
});
gulp.task(wrappedTaskName + '-all', function(done) {
tasksToExecute.push(done);
runSequence.apply(null, tasksToExecute);
});
}
// this registers a task called 'nothing-all'
registerTaskForAllFolders('nothing');
// this registers a task called 'clean-all'
registerTaskForAllFolders('clean');
// this registers a task called 'package-all'
registerTaskForAllFolders('package');
shared-gulp-tasks.js
module.exports = function(gulp) {
gulp.task('nothing', function(done) {
console.log('doing nothing in ' + process.cwd());
done();
});
}
terminal
gulp nothing-all
output
[17:08:51] Starting 'nothing-all'...
[17:08:52] Starting 'nothing_pkgA'...
[17:08:52] Starting 'nothing'...
doing nothing in d:\git\myproject\pkgA
[17:08:52] Finished 'nothing' after 171 μs
[17:08:52] Finished 'nothing_pkgA' after 2.23 ms
[17:08:52] Starting 'nothing_pkgB'...
[17:08:52] Starting 'nothing'...
doing nothing in d:\git\myproject\pkgB
[17:08:52] Finished 'nothing' after 2.03 ms
[17:08:52] Finished 'nothing_pkgB' after 11 ms
[17:08:52] Starting 'nothing_pkgC'...
[17:08:52] Starting 'nothing'...
doing nothing in d:\git\myproject\pkgC
[17:08:52] Finished 'nothing' after 1.93 ms
[17:08:52] Finished 'nothing_pkgC' after 11 ms
[17:08:52] Finished 'nothing-all' after 345 ms
I have an existing nodejs app which i have pushed to the VSTS repository.
I have added three build tasks
npm install - running fine
Gulp - i have a gulpfile in which there is one task which executes "nodemon app.js" command, runs fine but this command starts listening the ports and hence the 3rd task which is the Web App task doesnt gets build. Until and unless Gulp task is built successfully, 3rd task wont get built. for eg "Express server started listening on port 1234" and then the gulp build task is still in running state due to which upfront task doesnt get started.
Some tasks, like nodemon start a background process and will watch the folder for changes. Normally you'd place these under the watch command, then implement a one-pass version of that in the build command.
As long as the Watch is running, control over the process isn't handed back to the Build agent and this will hang your build.
(Re)moving the commands that start watch/monitor processes so they won't get executed during a build is your best solution.
In the JHipster gulpfile.js, there is a watch task set up for JS files which attempts to call a 'browserify' task. However, there is no 'browserify' task defined. If you are running 'gulp server' during development, the process will terminate as soon as you modify one of your JS files.
[11:43:19] Server started
[11:43:19] LiveReload started on port 35729
[11:43:19] Finished 'server' after 52 ms
**[11:52:14] Task 'browserify' is not in your gulpfile**
[11:52:14] Please check the documentation for proper gulpfile formatting
Is this a bug? I don't see why we would need to call to browserify with the current setup.
Yes it looks like a bug:https://github.com/jhipster/generator-jhipster/issues/367
The Gulp option is a community effort, and is less stable than the Grunt option.
However, of course, our goal is to have a correct and stable Gulp option for our soon-to-be-released 1.0 version.
Can you add your comments and feedback to the opened bug?
I have a simple build step of my project where I mainly concatenate several files. The code looks like this:
var gulp = require('gulp');
var p = require('gulp-load-plugins')();
var srcDir = 'src/';
var src=[/*some files here*/];
var header='',footer='';
gulp.task('build',function(){
gulp.src(src,{cwd:srcDir})
.pipe(p.concat('sdk.js'))
.pipe(p.header(header))
.pipe(p.footer(footer))
.pipe(p.jshint())
.pipe(gulp.dest('dist/'));
});
gulp.task('watch',function(){
gulp.watch('src/**/*.js',['build']);
});
gulp.task('default',['build','watch']);
The first build task works as expected, with execution time about 550ms:
[gulp] Starting 'build'...
[gulp] Finished 'build' after 541 ms
However, when I change something in the src folder, the build task takes very little time, although I don't use any caching:
[gulp] Starting 'build'...
[gulp] Finished 'build' after 2.37 ms
What's more, the task has no effect - the dist directory doesn't change. I noticed, however, that the files update when I kill gulp and run it again. I don't know whether it's something with gulp or the file system itself I don't understand.
It turns out that the problem was not associated with gulp - actually it was a problem with my IDE, WebStorm. While the IDE should normally update the files automatically using the mechanism described in this comment to another question
(and it also did in my case not so long ago...). Otherwise it falls back to checking all the files at a time interval. The file was not being updated in my IDE view, but it was already changed by gulp, which worked all the time. Until I fix the issue with automatic reloading, using File | Synchronize results in the up-to-date version of the file being shown.