npm install grunt-scram> Scramble your Javascript
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:
``shell`
npm install scram --save-dev
Once the plugin has been installed, it may be enabled inside your Gruntfile with this line of JavaScript:
`js`
grunt.loadNpmTasks('scram');
to the data object passed into grunt.initConfig().`js
grunt.initConfig({
scram: {
options: {},
build: {
"./build/app.scram.min.js" : ["./build/app.min.js"],
},
},
})
`$3
#### options.src
File you wish to scramble#### options.dest
File thats the scrambled result$3
Let's take an arbitrary piece of code in your build at
:`js
!(function(w,d) {
var img = d.createElement("img");
img.src = "http://placekitten.com/g/200/300"; var body = document.querySelector("body");
body.appendChild(img);
}(this, this.document));
`Now we add it to our Grunt task
:`js
grunt.initConfig({
scram: {
options: {},
files: {
"./build/app.scram.js" : ["./app.js"],
},
},
})
`The contents may look like this then:
js
var data=
["\\x21","\\x28","\\x66","\\x75","\\x6e","\\x63",
/ some more hex... /
"\\x74","\\x29","\\x29","\\x3b","\\x0a"];
var x=""; data.forEach(function(s){x += String.fromCharCode(parseInt(s.substr(2), 16));}); eval(x)
`And we add it to our page:
html
`Aaand we have kittens!
#### Default Options
Here we simply set a destination file we want to scramble the script into. If it self bootsraps even better. The script will go through eval() to get it working.
js
grunt.initConfig({
scram: {
options: {},
files: {
"./build/app.scram.min.js" : ["./build/app.min.js"],
},
},
})
``