It'll be hassle to npm i everytime you want to start your gulp projects. Not to mentioned it'll take a lot of storage space for node_modules.
Below is the hack workflow that I use for multiple projects:
|- node_modules
|- package.json
|- gulpfile.js
find the following line, and change the name & path whenever you work on specific projects
//The following example shows gulp to process the a project
// /scss/a.scss == a
// /scss/b.scss == b
// /scss/c.scss == c
// Please change the following line with respective project, it can be done one at time
var jsbuild = gulp.src(folder.src + 'js/**/*')
.pipe(deporder())
.pipe(concat('a.js'));
return gulp.src(folder.src + 'scss/a.scss')
.pipe(sass({
outputStyle: 'nested',
imagePath: 'images/',
precision: 3,
errLogToConsole: true
}))
.pipe(postcss(postCssOpts))
// .pipe(concat('style.min.css'))
.pipe(gulp.dest(folder.build + 'css/'));
});
|- src/
|- images/
|- html
|- a.html
<link rel="stylesheet" type="text/css" href="../css/a.css">
|- b.html
<link rel="stylesheet" type="text/css" href="../css/b.css">
|- c.html
<link rel="stylesheet" type="text/css" href="../css/c.css">
|- js/
|- a.js
|- b.js
|- c.js
|- scss/
|- a
|- general
|- component
|- custom
|- b
|- general
|- component
|- custom
|- c
|- general
|- component
|- custom
|- a.scss
|- b.scss
|- c.scss
|- dist/
|- fonts/
|- images/
|- html
|- a.html
|- b.html
|- c.html
|- js/
|- a.js
|- css/
|- a.css
|- b.css
|- c.css
|- static/
|- fonts/