I have a problem with gulp-concat. I'm trying to concate all my js files in a single file, let's say, dist/app.js.
But there is something that I don't understand. In that file, my required files path are still the same than before...
Here is my gulpfile.js :
var gulp = require("gulp");
var sourcemaps = require("gulp-sourcemaps");
var babel = require("gulp-babel");
var concat = require("gulp-concat");
var resolveDependencies = require("gulp-resolve-dependencies");
gulp.task("default", function () {
return gulp.src("client/**/*.js")
.pipe(sourcemaps.init())
.pipe(babel())
.pipe(concat("app.js"))
.pipe(sourcemaps.write("."))
.pipe(gulp.dest("dist/js"));
});
As you can see, I want to concat nested folders.
Take a look for example at the top of my /client/components/app.js :
import React, {PropTypes} from 'react';
import AppLeftNav from './AppLeftNav';
import {AppCanvas, AppBar, Styles} from 'material-ui';
//Code here
So in my app app.js generated by gulp, i can see :
var _AppLeftNav = require('./AppLeftNav');
It's a relative path and it can't work.
So, what's the tricks to handle theses required files with relative path ?
Thanks a lot.
EDIT : See the error I get :
Error: Cannot find module './components/App.js'
at Function.Module._resolveFilename (module.js:336:15)
at Function.Module._load (module.js:278:25)
at Module.require (module.js:365:17)
at require (module.js:384:17)
at Object.<anonymous> (MyFolder\dist\js\app.js:34:24)
at Module._compile (module.js:460:26)
at Object.Module._extensions..js (module.js:478:10)
at Module.load (module.js:355:32)
at Function.Module._load (module.js:310:12)
at Module.require (module.js:365:17)
To anyone who might have the same problem. Babel currently doesn't support imports inlining #1681, neither do gulp-concat, as it's just concatenating files.
I opted to use Rollup to propertly resolve dependencies and only then transpile output:
var gulp = require('gulp');
var gutil = require('gulp-util');
var babel = require('gulp-babel');
var concat = require('gulp-concat');
var rollup = require('gulp-rollup');
gulp.task('build', function () {
return gulp.src('src/parser-factory.js', { read: false })
.pipe(rollup({ external: ['request', 'cheerio'] }))
.on('error', gutil.log)
.pipe(babel({ stage: 0 }))
.pipe(concat('realty-parser.js'))
.pipe(gulp.dest('lib'));
});
If you want to get it all in a single file then you will have to write .pipe(gulp.dest("dist/js/jsfile.js")); where jsfile is the name of your file.
Related
This is my first time using Gulp, I am trying to make a gulpfile to minify and merge css and js files, but I have this error when I run the command gulp:
C:\Users\S.Hocine\Desktop\gulpTest>gulp
AssertionError [ERR_ASSERTION]: Task function must be specified
at Gulp.set [as _setTask] (C:\Users\S.Hocine\Desktop\gulpTest\node_modules\undertaker\lib\set-task.js:10:3)
at Gulp.task (C:\Users\S.Hocine\Desktop\gulpTest\node_modules\undertaker\lib\task.js:13:8)
at Object.<anonymous> (C:\Users\S.Hocine\Desktop\gulpTest\gulpfile.js:36:6)
at Module._compile (internal/modules/cjs/loader.js:1156:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:1176:10)
at Module.load (internal/modules/cjs/loader.js:1000:32)
at Function.Module._load (internal/modules/cjs/loader.js:899:14)
at Module.require (internal/modules/cjs/loader.js:1042:19)
at require (internal/modules/cjs/helpers.js:77:18)
at requireOrImport (C:\Users\S.Hocine\AppData\Roaming\npm\node_modules\gulp-cli\lib\shared\require-or-import.js:19:11) {
generatedMessage: false,
code: 'ERR_ASSERTION',
actual: false,
expected: true,
operator: '=='
}
my gulpfile:
const gulp = require('gulp');
const uglify = require('gulp-uglify');
const concat = require('gulp-concat');
// minify and copy html
gulp.task('minifyHtml', function(){
gulp.src('src/*.html')
.pipe(uglify())
.pipe(gulp.dest('dest'));
});
// minify and merge css
gulp.task('minifyMergeCss', function(){
gulp.src('src/css/*.css')
.pipe(concat('merged-min.css'))
.pipe(uglify())
.pipe(gulp.dest('dest/css'));
});
// minify and merge js
gulp.task('minifyMergeJs', function(){
gulp.src('src/js/*.js')
.pipe(concat('merged-min.js'))
.pipe(uglify())
.pipe(gulp.dest('dest/js'));
});
gulp.task('default', ['minifyHtml', 'minifyMergeCss', 'minifyMergeJs']);
gulp.task('watch', function(){
gulp.watch('src/*.html', ['minifyHtml']);
gulp.watch('src/css/*.css', ['minifyMergeCss']);
gulp.watch('src/js/*.js', ['minifyMergeJs']);
});
my gulp version:
CLI version: 2.3.0
Local version: 4.0.2
Where is the problem ?
If you uses the gulp version V3 that contain the different syntax use the latest version of gulp, and also for gulp task modules that you are using into latest version if that doesn't work too use this way,
An example of your function it must be,
gulp.task('default', gulp.series('minifyHtml', 'minifyMergeCss', 'minifyMergeJs'));
Now that'll work fine. This happens because of in gulp v4 the list parameter has been deprecated.
see the more robust example in the gulp documentation for running tasks in series
or you can see the documentation npm
Hii I have simple node server, with the following structure
myapp
-config
-default-json
-index.js
-package-lock.json
-package.json
Here is my part of my index.js
'use strict';
const
config = require('config'),
express = require('express'),
request = require('request'),
body_parser = require('body-parser'),
app = express().use(body_parser.json()); // creates express http server
// Sets server port and logs message on success
app.listen(process.env.PORT || 1337, () => console.log('webhook is listening'));
when I run node index.js I get the following error
internal/modules/cjs/loader.js:583
throw err;
^
Error: Cannot find module 'config'
at Function.Module._resolveFilename (internal/modules/cjs/loader.js:581:15)
at Function.Module._load (internal/modules/cjs/loader.js:507:25)
at Module.require (internal/modules/cjs/loader.js:637:17)
at require (internal/modules/cjs/helpers.js:22:18)
at Object.<anonymous> (C:\xampp\htdocs\chat\index.js:13:14)
at Module._compile (internal/modules/cjs/loader.js:689:30)
at Object.Module._extensions..js (internal/modules/cjs/loader.js:700:10)
at Module.load (internal/modules/cjs/loader.js:599:32)
at tryModuleLoad (internal/modules/cjs/loader.js:538:12)
at Function.Module._load (internal/modules/cjs/loader.js:530:3)
what is wrong with my code?
I found solution by by installing config from npm
https://www.npmjs.com/package/config
follow the instruction above and it should work , it might help some one in future
You have to explicitly add the config module in your package.json:
"dependencies": {
"config": "version number"
}
https://www.npmjs.com/package/config
It means there is no config.js in your current location. Put the exact location of the config.js file..
Try,
config = require('./config/config'),
I'm trying to require another file within a node project I'm working on; this will be a command line tool. What I'm trying to do is create a formatted color output using the following file format.js:
modules.exports = {
warning: function(input){
say("\033[31m" + input)
},
info: function(input){
say("\033[36m" + input)
}
}
From there I want to create the colored output and put it into a file named gen_email.js. That file has these two functions in it:
function say(input){
console.log(input)
}
function helpPage(){
say('');
format.info("test")
}
When I attempt to run this it outputs the following:
C:\Users\thomas_j_perkins\bin\javascript\node\email\lib\format.js:1
(function (exports, require, module, __filename, __dirname) { modules.exports = {
^
ReferenceError: modules is not defined
at Object.<anonymous> (C:\Users\thomas_j_perkins\bin\javascript\node\email\lib\for
mat.js:1:63)
at Module._compile (module.js:409:26)
at Object.Module._extensions..js (module.js:416:10)
at Module.load (module.js:343:32)
at Function.Module._load (module.js:300:12)
at Module.require (module.js:353:17)
at require (internal/module.js:12:17)
at Object.<anonymous> (C:\Users\thomas_j_perkins\bin\javascript\node\email\gen_ema
il.js:3:16)
at Module._compile (module.js:409:26)
at Object.Module._extensions..js (module.js:416:10)
I'm not understanding what I'm doing wrong, according to this I am requiring the file the correct way. What am I doing wrong here, do I need to move the say function into the other file?
It should be
module.exports = {
warning: function(input){
say("\033[31m" + input)
},
info: function(input){
say("\033[36m" + input)
}
}
in the other file
const format = require("whatEverPathIsOn/format.js")
if the file is under the same path just
const format = require("./format.js")
That should be module, not modules.
I have a very simple gulpfile.babel.js .
import 'babel-polyfill'
let y = ()=>{return Promise.resolve(true)}
async function awaitY() {
let m = await y()
console.log(m)
}
awaitY()
and the following dev dependencies in my package.json
"babel-core": "^6.7.4",
"babel-polyfill": "^6.7.4",
"babel-preset-es2015": "^6.6.0",
"babel-preset-stage-0": "^6.5.0"
and the following in my .babelrc
{
"presets": ["es2015","stage-0"]
}
When I run gulp, i get the following error...
MacBook-Pro-2:gulptest jschlesser$ gulp
[15:26:17] Requiring external module babel-core/register
/Users/jschlesser/Dropbox (Personal)/prj/cursive/spout/gulptest/gulpfile.babel.js:4
var ref = _asyncToGenerator(regeneratorRuntime.mark(function _callee() {
^
ReferenceError: regeneratorRuntime is not defined
at /Users/jschlesser/Dropbox (Personal)/prj/cursive/spout/gulptest/gulpfile.babel.js:4:31
at Object.<anonymous> (gulpfile.babel.js:5:16)
at Module._compile (module.js:435:26)
at loader (/Users/jschlesser/Dropbox (Personal)/prj/cursive/spout/gulptest/node_modules/babel-register/lib/node.js:126:5)
at Object.require.extensions.(anonymous function) [as .js] (/Users/jschlesser/Dropbox (Personal)/prj/cursive/spout/gulptest/node_modules/babel-register/lib/node.js:136:7)
at Module.load (module.js:356:32)
at Function.Module._load (module.js:311:12)
at Module.require (module.js:366:17)
at require (module.js:385:17)
at Liftoff.handleArguments (/Users/jschlesser/.npm-packages/lib/node_modules/gulp/bin/gulp.js:116:3)
MacBook-Pro-2:gulptest jschlesser$
I would like to know what steps are needed to use async/await in a gulpfile. The error implies that gulp used a require hook to run the gulpfile through babel and it transformed the async function into a generator.
It says the error is on line 4.
var ref = _asyncToGenerator(regeneratorRuntime.mark(function _callee() { .
But it looks like its not injecting all of the right stuff into that compiled file to use the regeneratorRuntime.
You need to have a separate entry point that loads the polyfill, and then the main application file.
gulpfile.babel-entry.js
import 'babel-polyfill'
import './gulpfile.babel.js'
gulpfile.babel.js
let y = ()=>{return Promise.resolve(true)}
async function awaitY() {
let m = await y()
console.log(m)
}
awaitY()
more info
Another way to do is by supplying babel-polyfill as gulp parameter.
$ gulp --require babel-polyfill
include.js file contain
var test = function(){
console.log("log from included file");
};
main.js file contain
require('./include.js');
test();
when i tried to run main.js using node main.js command it shows
module.js:340
throw err;
^
Error: Cannot find module 'include.js'
at Function.Module._resolveFilename (module.js:338:15)
at Function.Module._load (module.js:280:25)
at Module.require (module.js:364:17)
at require (module.js:380:17)
at Object.<anonymous> (d:\Nishada\test\main.js:1:63)
at Module._compile (module.js:456:26)
at Object.Module._extensions..js (module.js:474:10)
at Module.load (module.js:356:32)
at Function.Module._load (module.js:312:12)
at Function.Module.runMain (module.js:497:10)
what is the reason for this error ?
The error refers to a file not being found, make sure your file is in the same directory as main.js and try:
include.js
module.exports = {
test: function(){
console.log("log from included file");
}
}
main.js
var myInclude = require('include.js');
myInclude.test();
You will need to export the test function in order to use it in main.js
var test = function(){
console.log("log from included file");
};
module.exports = test
And in main.js add require as follows
require('./include.js'); // assuming include.js is in same directory as main.js
If you do require('include.js') then node will search include in global packages
You will have to give relative path of include.js while require.
If both are in same directory write it like bellow
var include = require('./include.js');
include.test();
and from include.js you can define them as function for exports
exports.test = function(){
console.log("log from included file");
};
Even Better
export just one object having multiple functions from include.js instead of exporting each separate function.
Like bellow
include.js
exports.test = obj;
obj.func1 = function(){};
obj.func2 = function(){};
main.js
var test = require('./include.js').test;
test.func1();
test.func2();