gulp-include
gulp-include copied to clipboard
Ability to control syntax
Hi! Awesome plugin, love it very much! So simple include
/require
instead of all this bullshit with Webpack or Browserify, just like in Sass 😅
I have an idea: like in gulp-inject#optionsstarttag
, I want to control the syntax of how I use gulp-include
.
For example:
.pipe(include({
template: {
js: (type, file)=> {
return `//=${type} ${file}`
// returns //=require "file.js"
// or //=include 'file.js'
}
}
}))
This will be a default setting for JS files.
I want to use require()
-like syntax to allow my editor to hint me relative paths by dropdown when it's uncommented, so I write require('')
, hit Ctrl+Space
and editor opens a popup with matched files:

And then I comment it and add =
symbol, so I have this:
//=require('../../node_modules/jquery/dist/jquery.js')
And I sure that I have the right path.
But now every time I add //require
I have to remove (
and )
to make it work.
If there will be an option to modify this comment template, I will add parentheses to it:
.pipe(include({
template: {
js: (type, file)=> {
return `//=${type} (${file})`
}
}
}))
I'm interested in this as I want to use gulp-include with ABNF files, which use ;
as a comment prefix, which doesn't appear to be supported. For example, I've tried ;= require grammar.abnf
and it doesn't work. #= require grammar.abnf
does appear to work. I could use gulp-replace
to convert the comments, but it would certainly be an improvement if there was a way support arbitrary comment styles or prefixes.
Instead of using a lambda, I would suggest specifying a prefix as a regular expression. This would be easier to implement as gulp-include already uses a regular expression to match include/require directives.
I would suggest a prefix
option that accepts a string or a regular expression. This would be much like the similar gulp-file-include.
An example using a string:
.pipe(include({
prefix: '//'
}))
And to support different prefix for different prefix per extension:
.pipe(include({
prefix: {
'js': '//',
'html': '<!--',
'css': '/*',
'abnf': ';'
}