grunt-injector
Advanced tools
Inject references to files into other files (think scripts and stylesheets into an html file)
I don't have enough time to maintain this plugin as I would want to, so I'm looking for people who want to help out and be contributors/repository admins.
Contact me! See package.json for contact information.
Inject references to files into other files (think scripts and stylesheets into an html file)
Current plugin requires Grunt ~1.0.0 and supports node engine >=0.10.0.
Plugin versions v1.0.1 (and earlier) require Grunt >=0.4.x and support node engine >= 0.8.0.
If you haven't used Grunt before, be sure to check out the Getting Started guide, as it explains how to create a Gruntfile as well as install and use Grunt plugins. Once you're familiar with that process, you may install this plugin with this command:
npm install grunt-injector --save-dev
Once the plugin has been installed, it may be enabled inside your Gruntfile with this line of JavaScript:
grunt.loadNpmTasks('grunt-injector');
In your project's Gruntfile, add a section named injector to the data object passed into grunt.initConfig().
grunt.initConfig({
injector: {
options: {
// Task-specific options go here.
},
your_target: {
// Target-specific file lists and/or options go here.
},
},
})
Type: String
Defaulting to dest property of file group
The filename for the source template where you have your injection tags.
If not provided, the given dest file must exist and will be used as source template as well, and therefor will be modified on injection.
Type: String
Default value: NULL
The contents of the template to use. If specified it overrides the template option.
Type: String|Array
Default value: NULL
A path or paths that should be removed from each injected file path.
Type: Boolean
Default value: !options.relative
Specifies if a root slash (/) should be added to all paths.
Type: Boolean
Default value: true
Specifies if relative paths should be injected.
Type: String
Default value: NULL
Used to override the dest property of file groups, which is necessary when using dynamically built files objects.
Type: Boolean
Default value: false
If set to true each injected file will be switched to its minified counterpart (i.e. *.min. files), if it exists that is otherwise the original file is used as usual.
Type: String
Default value: <!-- injector:{{ext}} -->
Set the start tag that the injector is looking for. {{ext}} is replaced with file extension name, e.g. "css", "js" or "html".
The extension for files collected from from Bower components is prepended with option bowerPrefix if given.
Type: String
Default value: <!-- endinjector -->
Set the end tag that the injector is looking for. {{ext}} is replaced with file extension name, e.g. "css", "js" or "html".
The extension for files collected from from Bower components is prepended with option bowerPrefix if given.
Type: String
Default value: ''
Set the prefix to append to the beginning of each injected file. Useful to change the directory name in combination with ignorePath.
Type: String
Default value: ''
Set the postfix to append to the end of each injected file. Useful to reset cached resources like "/path/to/script.js?offset01".
Type: String
Default value: NULL
Set prefix for file extension when replacing {{ext}} in start and end tag (see above).
Added in v.0.5.0. To keep old behaviour set this to "bower:". See Bower dependency injection below as well.
Type: String
Default value: null
Configure what lineEnding character(s) to use between injections.
If no value specified, grunt injector will try to figure out the default line ending character(s) from template files.
Type: Function
Params: filepath, index (0-based file index), length (total number of files to inject)
Default value: a function that returns:
<link rel="stylesheet" href="<filename>.css"><script src="<filename>.js"></script><link rel="import" href="<filename>.html">Used to generate the content to inject for each file.
Type: Function
Params: a, b (is used as compareFunction for Array.prototype.sort)
Default value: NULL
If set the given function is used as the compareFunction for the array sort function, to sort the source files by.
N.B. Shouldn't be used in conjunction with a bower.json file as source, because wiredep, which collects Bower installed dependencies, has some intelligent sorting built in.
index.html:
<!DOCTYPE html>
<html>
<head>
<title>Example</title>
<!-- injector:css -->
<!-- endinjector -->
</head>
<body>
<!-- injector:js -->
<!-- endinjector -->
</body>
</html>
Gruntfile.js:
grunt.initConfig({
injector: {
options: {},
local_dependencies: {
files: {
'index.html': ['**/*.js', '**/*.css'],
}
}
}
})
After injection
index.html:
<!DOCTYPE html>
<html>
<head>
<title>Example</title>
<!-- injector:css -->
<link rel="stylesheet" href="file1.css">
<link rel="stylesheet" href="file2.css">
<!-- endinjector -->
</head>
<body>
<!-- injector:js -->
<script src="file1.js"></script>
<script src="file2.js"></script>
<!-- endinjector -->
</body>
</html>
The grunt-injector can be used to inject your installed Bower Components as well.
To do this the module wiredep is used, and here's how the configuration can look like in that case:
N.B From version 0.5.0 the {{ext}} in the starttag is not prefixed with bower: by default anymore! To keep the old behaviour set the bowerPrefix to "bower:".
Gruntfile.js:
grunt.initConfig({
injector: {
options: {},
bower_dependencies: {
files: {
'index.html': ['bower.json'],
}
}
}
})
index.html:
<!DOCTYPE html>
<html>
<head>
<title>Example</title>
<!-- injector:css -->
<!-- endinjector -->
</head>
<body>
<!-- injector:js -->
<!-- endinjector -->
</body>
</html>
For more advanced task configurations see the Gruntfile.js in this repository and have a look at the tests in test/injector_test.js.
In lieu of a formal styleguide, take care to maintain the existing coding style. Add unit tests for any new or changed functionality. Lint and test your code using Grunt.
1.1.0 - 2016-10-10
1.0.1 - 2016-05-20 - fix (#41)
1.0.0 - 2016-04-23
0.6.0 - 2014-11-26 - Adding relative option (#15)
0.5.4 - 2014-07-22 - Now able to handle overrides in bower.json (#11)
0.5.3 - 2014-07-16
addRootSlash=false problem with ignorePath #10lineEnding option #8{{ext}} in tags #50.5.2 - 2014-03-05 - Getting bower components directory from .bowerrc file if it exists (Fixes: #2)
0.5.1 - 2014-02-21 - Adding addRootSlash option (Fixes: #1)
0.5.0 - 2013-12-29 - Removing the default bower: prefix for Bower injections (see Bower dependency injection above)
0.4.1 - 2013-12-23 - Fixing index and length params for transform function
0.4.0 - 2013-12-23 - Adding templateString option
0.3.1 - 2013-12-15 - Fixing possibility to provide ignorePath as array
0.3.0 - 2013-12-10 - Adding sort option to be able to sort files. Also rewriting for performance which removes unnecessary injections for dynamic file objects
0.2.0 - 2013-11-20 - Don't write to destination file if it hasn't been changed by the injector (useful to not trigger any unnecessary watch tasks if applicable)
0.1.2 - 2013-11-17 - Making it possible to only provide destFile and not template
0.1.1 - 2013-11-17 - ignorePath now only removes from start of path
0.1.0 - 2013-11-17 - First release
FAQs
Inject references to files into other files (think scripts and stylesheets into an html file)
The npm package grunt-injector receives a total of 9,497 weekly downloads. As such, grunt-injector popularity was classified as popular.
We found that grunt-injector demonstrated a not healthy version release cadence and project activity because the last version was released a year ago. It has 2 open source maintainers collaborating on the project.
Did you know?
Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.
Research
Security News
Attackers used a malicious npm package typosquatting a popular ESLint plugin to steal sensitive data, execute commands, and exploit developer systems.
Security News
The Ultralytics' PyPI Package was compromised four times in one weekend through GitHub Actions cache poisoning and failure to rotate previously compromised API tokens.
Security News
Research
Socket researchers found a malicious Maven package impersonating the legitimate ‘XZ for Java’ library, introducing a backdoor for remote code execution.