gulp

I am trying to use gulp and browserify to transform my .jsx files into .js files. var gulp = require('gulp'); var browserify = require('browserify'); var reactify = require('reactify'); gulp.task('js', function () { browserify('public/javascripts/src/app.jsx') .transform(reactify) .bundle() .pipe(gulp.dest('public/javascripts/dist')) }); ``` The above threw Arguments to path.resolve must be strings . I managed to get around it by using vinyl-source-stream var source = require('vinyl-source-stream'); ... .bundle() .source('app.js') ... Why does this work? I am fairly new to nodejs and gulp.

I am trying to merge css and scss files into a main.css file that goes in my build directory. Its working, but not in the right order. The style attributes from the scss files need to be in the bottom of the main.css file so they overrule the rest. my Gulp task looks like this: //CSS gulp.task('css', function () { var cssTomincss = gulp.src(['dev/css/reset.css', 'dev/css/style.css','dev/css/typography.css', 'dev/css/sizes.css']); var cssFromscss = gulp.src(['dev/css/*.scss']) .pipe(sass()); return es.merge(cssTomincss, cssFromscss) .pipe(concat('main.css')) .pipe(minifyCSS()) .pipe(gulp.dest(

I try to make a gulp compile my sass then autoprefixit with gulp-autoprefixer but i'm getting an error. var gulp = require('gulp'), sass = require('gulp-sass'), autoprefixer = require('gulp-autoprefixer'); gulp.task('test', function(){ gulp.src('_sass/main.sass') .pipe(sass()) .pipe(autoprefixer()) .pipe(gulp.dest('./assets/css')); }); I'm trying to run this Gulpfile.js and i'm using : "gulp": "~3.9.0", "gulp-sass": "~2.0.4", "gulp-autoprefixer": "~3.0.1", and NPM version 1.3.10 When i run gulp test i get this : /home/matei/Tests/test-4/node_modules/gulp-autoprefixer/node_modules/postcss/lib

一、大前提，你必须安装必备的环境 　　 node.js 　　安装cnpm解决下载卡顿 　　　　命令： npm install - g cnpm -- registry = https :// registry . npm . taobao . org 　　　　查看官网api： https://www.gulpjs.com.cn/docs/getting-started/quick-start/ 　　安装gulp 　　　　查看官网api：npm install --global gulp-cli 　　　　查看官网api： https://www.gulpjs.com.cn/docs/getting-started/quick-start/ 　　查看环境 　　　　 二、开始： cnpm init cnpm install --save-dev gulp 创建gulpfile.js文件 let gulp = require('gulp'), sass = require('gulp-sass'),//sass转css插件 auto = require('gulp-autoprefixer');//解决浏览器兼容问题的插件 gulp.task('sass', function(){ return gulp.src('sass/*')//需要编译的文件目录 .pipe(sass(

I want to log to stdout (the config environment) when a gulp task is running or has run. Something like this: gulp.task('scripts', function () { var enviroment = argv.env || 'development'; var config = gulp.src('config/' + enviroment + '.json') .pipe(ngConstant({name: 'app.config'})); var scripts = gulp.src('js/*'); return es.merge(config, scripts) .pipe(concat('app.js')) .pipe(gulp.dest('app/dist')) .on('success', function() { console.log('Configured environment: ' + environment); }); }); I am not sure what event I should be responding to or where to find a list of these. Any pointers? Many

How do I debug a gulp task defined in my gulpfile.js with a debugger such as the Google Chrome debugger, stepping through the task's code line by line? With Node.js version 6.3+ you can use the --inspect flag when running your task. To debug a gulp task named css : Find out where your gulp executable lives. If gulp is installed locally, this will be at node_modules/.bin/gulp . If gulp is installed globally, run which gulp (Linux/Mac) or where gulp (Windows) in a terminal to find it. Run one of these commands according to your version of Node.js. If required, replace ./node_modules/.bin/gulp

I am developing a Gulpfile . Can it be made to restart as soon as it changes? I am developing it in CoffeeScript. Can Gulp watch Gulpfile.coffee in order to restart when changes are saved? You can create a task that will gulp.watch for gulpfile.js and simply spawn another gulp child_process . var gulp = require('gulp'), argv = require('yargs').argv, // for args parsing spawn = require('child_process').spawn; gulp.task('log', function() { console.log('CSSs has been changed'); }); gulp.task('watching-task', function() { gulp.watch('*.css', ['log']); }); gulp.task('auto-reload', function() { var

I tried to uglify output of Browserify in Gulp, but it doesn't work. gulpfile.js var browserify = require('browserify'); var gulp = require('gulp'); var uglify = require('gulp-uglify'); var source = require('vinyl-source-stream'); gulp.task('browserify', function() { return browserify('./source/scripts/app.js') .bundle() .pipe(source('bundle.js')) .pipe(uglify()) // ??? .pipe(gulp.dest('./build/scripts')); }); As I understand I cannot make it in steps as below. Do I need to make in one pipe to preserve the sequence? gulp.task('browserify', function() { return browserify('./source/scripts/app

I see people using gulp with webpack. But then I read webpack can replace gulp? I'm completely confused here...can someone explain? UPDATE in the end I started with gulp. I was new to modern front-end and just wanted to get up and running quick. Now that I've got my feet quite wet after more than a year, I'm ready to move to webpack. I suggest the same route for people who start off in the same shoes. Not saying you can't try webpack but just sayin if it seems complicated start with gulp first...nothing wrong with that. If you don't want gulp, yes there's grunt but you could also just specify