I'm using gulp-minify-inline-scripts:
https://www.npmjs.org/package/gulp-minify-inline-scripts
I've got it in my gulp file as follows:
gulp.task('minify-inline', function() {
gulp.src('www/**/*.html')
.pipe(minifyInline())
.on('error', gutil.log)
.pipe(gulp.dest('www'))
});
However, whenever I run the gulp task (even with all inline scripts removed from the site files), I get this error message and I can't figure out what the problem is:
{ [Error: uglify inline scripts error: Error
at new JS_Parse_Error (/Users/heather/Documents/Work/company/Web/NewSite/node_modules/gulp-minify-inline-scripts/node_modules/uglify-js/lib/parse.js:189:18)
at js_error (/Users/heather/Documents/Work/company/Web/NewSite/node_modules/gulp-minify-inline-scripts/node_modules/uglify-js/lib/parse.js:197:11)
at croak (/Users/heather/Documents/Work/company/Web/NewSite/node_modules/gulp-minify-inline-scripts/node_modules/uglify-js/lib/parse.js:656:9)
at token_error (/Users/heather/Documents/Work/company/Web/NewSite/node_modules/gulp-minify-inline-scripts/node_modules/uglify-js/lib/parse.js:664:9)
at unexpected (/Users/heather/Documents/Work/company/Web/NewSite/node_modules/gulp-minify-inline-scripts/node_modules/uglify-js/lib/parse.js:670:9)
at semicolon (/Users/heather/Documents/Work/company/Web/NewSite/node_modules/gulp-minify-inline-scripts/node_modules/uglify-js/lib/parse.js:690:43)
at simple_statement (/Users/heather/Documents/Work/company/Web/NewSite/node_modules/gulp-minify-inline-scripts/node_modules/uglify-js/lib/parse.js:864:73)
at /Users/heather/Documents/Work/company/Web/NewSite/node_modules/gulp-minify-inline-scripts/node_modules/uglify-js/lib/parse.js:723:47
at /Users/heather/Documents/Work/company/Web/NewSite/node_modules/gulp-minify-inline-scripts/node_modules/uglify-js/lib/parse.js:703:24
at block_ (/Users/heather/Documents/Work/company/Web/NewSite/node_modules/gulp-minify-inline-scripts/node_modules/uglify-js/lib/parse.js:977:20)]
message: 'uglify inline scripts error: Error\n at new JS_Parse_Error (/Users/heather/Documents/Work/company/Web/NewSite/node_modules/gulp-minify-inline-scripts/node_modules/uglify-js/lib/parse.js:189:18)\n
at js_error (/Users/heather/Documents/Work/company/Web/NewSite/node_modules/gulp-minify-inline-scripts/node_modules/uglify-js/lib/parse.js:197:11)\n
at croak (/Users/heather/Documents/Work/company/Web/NewSite/node_modules/gulp-minify-inline-scripts/node_modules/uglify-js/lib/parse.js:656:9)\n
at token_error (/Users/heather/Documents/Work/company/Web/NewSite/node_modules/gulp-minify-inline-scripts/node_modules/uglify-js/lib/parse.js:664:9)\n
at unexpected (/Users/heather/Documents/Work/company/Web/NewSite/node_modules/gulp-minify-inline-scripts/node_modules/uglify-js/lib/parse.js:670:9)\n
at semicolon (/Users/heather/Documents/Work/company/Web/NewSite/node_modules/gulp-minify-inline-scripts/node_modules/uglify-js/lib/parse.js:690:43)\n
at simple_statement (/Users/heather/Documents/Work/company/Web/NewSite/node_modules/gulp-minify-inline-scripts/node_modules/uglify-js/lib/parse.js:864:73)\n
at /Users/heather/Documents/Work/company/Web/NewSite/node_modules/gulp-minify-inline-scripts/node_modules/uglify-js/lib/parse.js:723:47\n
at /Users/heather/Documents/Work/company/Web/NewSite/node_modules/gulp-minify-inline-scripts/node_modules/uglify-js/lib/parse.js:703:24\n
at block_ (/Users/heather/Documents/Work/company/Web/NewSite/node_modules/gulp-minify-inline-scripts/node_modules/uglify-js/lib/parse.js:977:20)',
showStack: false,
showProperties: true,
plugin: 'gulp-minify-inline-scripts',
__safety: { toString: [Function] } }
Related
I'm picking up an error with gulp on Windows 10
Running gulp through git bash works fine, it opens the current project in a new browser tab, but the moment I alter the style.scss file, and save it in atom, this error comes up...
[17:02:54] Starting 'css'...
events.js:183
throw er; // Unhandled 'error' event
^
BrowserslistError: Unknown browser query `> 1%`
at C:\wamp64\www\wordpress\wp-content\themes\dev-project\node_modules\browserslist\index.js:164:11
at Array.reduce (<anonymous>)
at resolve (C:\wamp64\www\wordpress\wp-content\themes\dev-project\node_modules\browserslist\index.js:132:18)
at browserslist (C:\wamp64\www\wordpress\wp-content\themes\dev-project\node_modules\browserslist\index.js:224:16)
at Browsers.parse (C:\wamp64\www\wordpress\wp-content\themes\dev-project\node_modules\autoprefixer\lib\browsers.js:61:16)
at new Browsers (C:\wamp64\www\wordpress\wp-content\themes\dev-project\node_modules\autoprefixer\lib\browsers.js:52:30)
at loadPrefixes (C:\wamp64\www\wordpress\wp-content\themes\dev-project\node_modules\autoprefixer\lib\autoprefixer.js:70:24)
at plugin (C:\wamp64\www\wordpress\wp-content\themes\dev-project\node_modules\autoprefixer\lib\autoprefixer.js:81:24)
at LazyResult.run (C:\wamp64\www\wordpress\wp-content\themes\dev-project\node_modules\postcss\lib\lazy-result.js:277:20)
at LazyResult.asyncTick (C:\wamp64\www\wordpress\wp-content\themes\dev-project\node_modules\postcss\lib\lazy-result.js:192:32)
Solved it
Seen as though I am using Chrome, it was creating a conflict in /node_modules/browserlist/index.js
I edited %1 and took out firefox and added:
// Default browsers query
browserslist.defaults = [
'> 5%'
]
I then also had to change gulpfile to correspond with the following task:
// CSS via Sass and Autoprefixer
gulp.task('css', function() {
return gulp.src(scss + '{style.scss,rtl.scss}')
.pipe(sourcemaps.init())
.pipe(sass({
outputStyle: 'expanded',
indentType: 'tab',
indentWidth: '1'
}).on('error', sass.logError))
.pipe(postcss([
autoprefixer('> 5%')
]))
.pipe(sourcemaps.write(scss + 'maps'))
.pipe(gulp.dest(root));
});
Here's the source if anyone encounters an issue like this
I am trying to use gulp-sass to compile my scss files, but for some reason it is failing but not displaying an error message.
This is the command output for gulp styles:
[20:40:04] Requiring external module babel-core/register
[20:40:05] Using gulpfile ~\Documents\Development\Web Applications\webux\webux2\gulpfile.babel.js
[20:40:05] Starting 'styles'...
Here is my gulp task:
gulp.task('styles', () => {
return gulp.src('app/styles/*.scss')
.pipe($.sass.sync({
outputStyle: 'expanded',
precision: 10,
includePaths: ['.']
}).on('error', err => {
$.util.log(err);
}))
.pipe(gulp.dest('./tmp/styles'));
});
I get the same output when using $.sass.logError as the error callback.
The part of gulpfile is
gulp.task('serve',['sass'], function() {
browserSync.init({
proxy: "dev.cz/project"
});
gulp.watch(paths.styles.src + '**/*.scss', ['sass']);
gulp.watch("app/*.html").on('change', browserSync.reload);
});
it gives me error
events.js:72
throw er; // Unhandled 'error' event
^
Error: spawn EACCES
at errnoException (child_process.js:1000:11)
at Process.ChildProcess._handle.onexit (child_process.js:791:34)
The project is on out local server, I am connected to server via ssh. Everything works fine, until I take broswerync to the party. Any idea ??
This is probably an error because BrowserSync don't have permission to open a browser page for some reason.
adding the property open: false will solve this
in the gulp trying to perform html minification in the build
Code:
gulp.task('html',function(){
return gulp.src('app/**/*.html')
.pipe($.useref.assets({searchPath: '{.tmp,app}'}))
// Concatenate And Minify JavaScript
.pipe($.if('*.js', $.uglify({
preserveComments: 'some'
})))
// Concatenate And Minify Styles
.pipe($.if('*.css', $.csso()))
.pipe($.useref.restore())
.pipe($.useref())
// Update Production Style Guide Paths
.pipe($.replace('styles/main.css'))
// Minify Any HTML Output Files
.pipe(gulp.dest'dist'))
.pipe($.size({title: 'html'}));
});
Error:
TypeError: Uncaught, unspecified "error" event.
at TypeError (<anonymous>)
at Transform.emit (events.js:74:15)
at Transform.onerror (node_modules\gulp\node_modules\vinyl-fs\node_modules\through2\node_modules\readable-stream\lib\_stream_readable.js:558:12)
at Transform.emit (events.js:95:17)
at Transform.<anonymous> (index.js:80:42)
at Array.forEach (native)
at Transform.<anonymous> (index.js:68:35)
at Array.for Each (native)
at Transform.<anonymous> (index.js:46:36)
at Array.forEach (native)
has anyone came across this issue , please suggest how to fix this
Thanks
Sundar
upgrade gulp-useref:
npm remove gulp-useref && npm i gulp-useref --save-dev
I have some CSS that is created by gulp-ruby-sass. The resultant CSS file is referenced in the html used by gulp-useref to get my assets for concatenation, minification, etc. The problem is (I think) that gulp-ruby-sass hasn't written the CSS file to disk yet and gulp-useref can't find the file to include it in the build. So this code:
gulp.task("compile-css", function () {
gulp.src(paths.css.appFiles)
.pipe(gutil.env.debug ? sass({ debugInfo : true }) : sass())
.pipe(gutil.env.debug ? gutil.noop() : cssmin())
.pipe(gulp.dest(paths.css.appDistDir));
});
gulp.task("concatenateAllTheThings", ["compile-css"], function () {
var assets = useref.assets(); // useref package does the magic
return gulp.src(["./index.html", "./login.html", "./reset.html", "./confirm.html"])
.pipe(assets)
.pipe(gulpif('*.js',ngAnnotate()))
.pipe(gulpif('*.js', uglify()))
.pipe(assets.restore())
.pipe(useref())
.pipe(gulp.dest(paths.output.destination));
});
throws this error:
[19:06:32] Starting 'compile-css'...
[19:06:32] Finished 'compile-css' after 13 ms
[19:06:32] Starting 'concatenateAllTheThings'...
[19:06:32] Starting Karma server...
events.js:72
throw er; // Unhandled 'error' event
^
Error: ENOENT, no such file or directory 'c....\webui\css\custom.css'
at Object.fs.openSync (fs.js:427:18)
at Object.fs.readFileSync (fs.js:284:15)
at DestroyableTransform.<anonymous> (C....\AppData\Roaming\npm\node_modules\gulp-useref\index.js:81:61)
at Array.forEach (native)
at DestroyableTransform.<anonymous> (C....g\AppData\Roaming\npm\node_modules\gulp-useref\index.js:70:35)
at Array.forEach (native)
at DestroyableTransform.<anonymous> (C....\AppData\Roaming\npm\node_modules\gulp-useref\index.js:46:36)
at Array.forEach (native)
at DestroyableTransform._transform (C....\AppData\Roaming\npm\node_modules\gulp-useref\index.js:43:15)
at DestroyableTransform.Transform._read (C....\AppData\Roaming\npm\node_modules\gulp-useref\node_modules\through2\node_modules\readable-stream\lib\_stream_transform.js:184:10)
How can I get gulp-useref to see the CSS file from gulp-ruby-sass?
To let know gulp when a task is finished, you need to return the stream. This way, a task with a dependency on a task that you return will wait for it to finish.
So change compile-css to
gulp.task("compile-css", function () {
return gulp.src ...
});