I'm working with a legacy app we are slowly dragging forward to more modern libraries, etc. (I say this in advance to try to head off any "just upgrade to webpack/yarn/etc" answers. We're working on it, incrementally.)
Issue summary:
I have successfully included "grunt-babel": "^7.0.0", (I can see it working fine with a test let testBabel = 1 conversion). I also require "babel-polyfill": "^6.26.0"," to handle things like .includes() & Array function, which I have pulled in via my package.json "dependencies" (not "devDependencies", as I was instructed in the docs). My actual issue should be pretty simple: I have no understanding of the proper way to "load this via the entry file" for the set of libraries I am using.
Angular is v1.5
My Setup:
package.json
"devDependencies": {
"babel-core": "^6.26.0",
"babel-preset-env": "^1.6.1",
"grunt": "^0.4.5",
"grunt-babel": "^7.0.0",
"grunt-contrib-concat": "^0.5.1",
"grunt-contrib-copy": "^0.8.0",
"grunt-contrib-sass": "^0.9.2",
"grunt-contrib-uglify": "^0.9.1",
"grunt-contrib-watch": "^0.6.1",
"grunt-shell": "^2.1.0",
"load-grunt-tasks": "^3.5.2"
},
"dependencies": {
"babel-polyfill": "^6.26.0",
"d3-selection-multi": "~1.0.1",
"node-bourbon": "^1.2.3"
}
GruntFile.js
src: [
'./app/vinoEZ/javascripts/__header/jquery/jquery_number.js',
'./app/vinoEZ/javascripts/__header/jquery/hottie.js',
'./bower_components/localforage/dist/localforage.js',
'./bower_components/moment/min/moment.min.js',
'./app/vinoEZ/javascripts/__header/polyfill/entry.js',
'./app/vinoEZ/javascripts/__header/polyfill/eventsource.js',
'./bower_components/bootstrap-datepicker/dist/js/bootstrap-datepicker.js',
'./bower_components/smalot-bootstrap-datetimepicker/js/bootstrap-datetimepicker.js',
'./app/vinoEZ/javascripts/__header/underscore/underscore.js',
'./app/vinoEZ/javascripts/__header/myapp/base.js',
],
dest: './public/javascripts/myapp.head.min.js',
("myapp" is a substitute for our company name). The pollyfill/eventsource.js was existing, and so I have been working with pollyfill/entry.js as some of my experimentation - that may not be needed in the end.
In addition, we have our app.js file with all of our angular.module loading & directive stuff.
What I've tried:
I have tried adding require("babel-polyfill"); as the first line inside my module.exports = function(grunt) { - that seems to be ignored & I've been told that's wrong anyway
I have tried adding require("babel-polyfill"); and import "babel-polyfill"; inside that entry.js, which obviously isn't going to work and doesn't (syntax error as javascript doesn't understand)
I have tried add the same to the top of the angular app.js file but that just blows up my angular.
Really looking for a "write these words here", solve it for me answer, as I'm pretty sure it is a dead simple thing if you know what to type, but I'm at a loss.
TIA!
