Gulp issue when copying over fonts - npm

Every now and then, when I do a gulp build, I would get this error:
Error: EEXIST, mkdir 'Users/username/Desktop/Project/dist/fonts' at Error (native)
It doesn't happen on every build though. My gulp code to copy over fonts is:
gulp.src(paths.fonts { cwd: bases.app })
.pipe(flatten()) // using gulp-flatten
.pipe(gulp.dest(bases.dist + 'fonts/'));
Is there a way for me to fix this issue?

I believe you have to delete the old fonts/ folder first.
Use something like Gulp del:
I also like gulp-util for gulp console logs:
gulp.task('removeFonts', function(cb) {
del([bases.dist + 'fonts/'], cb);
gutil.log(gutil.colors.magenta('Fonts folder removed');
});
Then call your mkdir build.

Related

`Module not found: 'vue-server-renderer'`

I am trying to compile my vue component to unit test it.
I added the import { render } from "#vue/server-test-utils"; line at the beginning of my test file. I also run the command npm i --save-dev #vue/server-test-utils which completed successfully. I checked the node_modules folder that the dependency was indeed installed.
But still when I run the test file I am getting the error:
WEBPACK Failed to compile with 1 error(s)
Error in ./node_modules/#vue/server-test-utils/dist/vue-server-test-utils.js
Module not found: 'vue-server-renderer'
Here I found a similar issue. I tried adding the
chainWebpack: config => {
config.module
.rule('vue')
.use('vue-loader')
.tap(options => {
options.isServerBuild = false;
return options;
});
}
to my webpack config, but it did not help.
I am using Vue 2. Maybe someone happened to stumble across this issue and knows a solution?
npm install --save-dev vue-server-renderer #vue/server-test-utils worked.
It seems that we have to install the two packages: the vue-server-renderer and then the #vue/server-test-utils.

Error when compiling Less in Gulp: `File not found with singular glob`

I'm working on a legacy site that has some pre-set-up Gulp commands.
I want to compile some .less files into .css. The existing script is as such:
gulp.task('less', function(){
return gulp.src('./src/css/less/app.less')
.pipe(less({
paths: [ path.join(__dirname, 'less', 'includes') ]
}))
.pipe(gulp.dest('./src/css/'))
});
However, when I run this I get an error:
Error: File not found with singular glob: /src/css/less/app.less (if this was purposeful, use `allowEmpty` option)
I've checked all paths, all #import and directories and they're all ok.
I am using Gulp Local: 4.0.0, CLI: 2.3.0.
Would anyone know could be causing this?
Maybe later, but Gulp 4 has a new syntax for writing tasks.
Also, you have to fix the wrong path to the source file:
// gulpfile.js
const SRC = 'src';
const DIST = 'src';
function lessTask(cb) {
return src(SRC + '/less/app.less')
.pipe(less())
.pipe(dest(DIST + '/style.css'));
}
exports.default = series(lessTask);
# On terminal:
gulp

returning the stream when there is no gulp.dest in Gulp

I have this gulp task
gulp.task('lint', function() {
return gulp.src(config.scripts.src)
.pipe(eslint())
.pipe(eslint.format())
.pipe(eslint.failAfterError())
.on('error', notify.onError('<%= error.message %>'));
});
Which basically lints my code and outputs the errors in the console while also displaying a notification with gulp-notify.
It runs fine when is called through gulp watch on the changed files, but it doesn't work if I call it in a stream of other tasks like this:
runSequence(['markup', 'styles', 'lint', 'browserify', 'images', 'fonts'], 'watch', cb);
unless of course i put a .pipe(gulp.dest('dest')) at the end of the task, but it is redundant bacause it writes the file.
So how should I go about this?
EDIT: here is the example task, and here is the runSequence which fails if this line is removed, to execute the project just run npm install and then npm start

"Error: cannot file config find .jshintrc " in cli after cloning the git repo and running grunt

When i try to run grunt , i am getting error as "cannot file the config file .jshintrc". I tried to install the config dependencies but nothing is working out.Can anyone tell me how to resolve this particular error. Do i need to define any particular rule in my grunt.js file as I believe this should be generated automatically in the root folder after running grunt.
The piece of lines for jshint task in grunt.js is-
grunt.initConfig({
lesslint:{
src: ['src/']
},
jshint: { // configure the task
all: ['src/app/**/*.js'],
options: {
reporter: require('jshint-html-reporter'),
reporterOutput: 'out/jshint-report.html',
//force report
force: false,
// JS Validation rules are configured in .jshintrc file.
jshintrc: '.jshintrc'
}
});
Any help is much appreciated.

Gulp karma "spawn ENAMETOOLONG" when processing many files

We're using gulp-karma plugin to gulp for our testing and PhantomJS. We're running on Windows and PhantomJS is a .exe file. Our files that has the tests has grown and now we're getting the error "spawn ENAMETOOLONG". From what I've gather from this answer: https://github.com/dbushell/grunt-svg2png/issues/17 for Grunt is that the problem is the parameters sendt to PhantomJS is too large. Have anyone had simlar problems or know any work arounds for it (except having to merge test files into fewer files)?
Error message:
[14:20:19] Starting Karma server...
events.js:72
throw er; // Unhandled 'error' event
^
Error: spawn ENAMETOOLONG
at errnoException (child_process.js:1001:11)
at Process.ChildProcess._handle.onexit (child_process.js:792:34)
Give files list into karma config instead of gulp.src()
Example
var files =[
'lib/**/*.js',
'src/**/*.js',
'test/**/*.js'
],
gulp.task('unit.test', function() {
return gulp.src([])
.pipe(karma({
configFile: 'my.karma.conf.js',
files : files,
action: 'run'
}))
.on('error', function(err) {
throw err;
});
});