Grunt task that allows for multiple js files to be injected into a file. Inspired by grunt-inject
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-inject-js --save-devOnce the plugin has been installed, it may be enabled inside your Gruntfile with this line of JavaScript:
grunt.loadNpmTasks('grunt-inject-js');Run this task with the grunt injectjs command.
Task targets, files and options may be specified according to the Grunt Configuring tasks guide.
The task is to allow for the injection of multiple javascript scripts into a document at defined places in the document. The use case arose when having to inject different third party analytics code at different locations.
grunt.initConfig({
injectjs: {
dev:
{
files:{
'test/output/index.html': 'test/fixtures/index.html'
},
scriptsrc: 'test/fixtures/*.js'
}
}
});Type: Grunt file configuration
The src HTML files must have the following comment(s) which are replaced by the injected JavaScript:
<!-- inject:[jsfile] -->where [jsfile] is the JavaScript file name to be injected. The file extension .js should be omitted.
The follow configuration would inject three files into the html document at the specified locations:
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>Grunt Inject JS Test file</title>
<!-- inject:google -->
<!-- inject:woopra -->
</head>
<body>
<h1>Test File</h1>
<p>
Content of test file
</p>
<!-- inject:pardot -->
</body>
</html>Type: String || Array || file glob
The path of the script(s) to be injected into the page.
It is recommended to have a directory that includes all the JavaScript files to be injected. A warning is raised if the directory contains non-JavaScript files.
This property is ignored if clear is set to true.
Type: Boolean
If this property is set to true then the scriptsrc is ignored and all tags following the pattern
<!-- inject:[A-Za-z]* --> are removed from the file.
This property was added as in some environments no Javascript files need to be injected and all inject placeholders removed from the file(s).
* 2016-07-14 v0.1.10
Update Readme text.
* 2016-07-14 v0.1.9
Update Grunt peer dependencies and Grunt versions
* 2015-01-16 v0.1.8 Beta Version
Update Readme text.
* 2015-01-16 v0.1.7 Beta Version
Add clear option to task and update tests and Readme text.
* 2015-01-14 v0.1.6 Beta Version
Use grunt standardised verbose messaging.
* 2015-01-13 v0.1.5 Beta Version
Final updates for Readme text.
* 2015-01-13 v0.1.4 Beta Version
Update Readme text and changed notifications.
* 2015-01-13 v0.1.3 Beta Version
Code refactor and improved user notifications.
* 2015-01-13 v0.1.2 Beta Version
Improved error handling when no files exist.
* 2015-01-12 v0.1.1 Beta Version
Renamed task name from inject_js to injectjs and associated code changes.
* 2015-01-12 v0.1.0 Beta Version
Initial release.