How to use with AngularJS?

[row1]

Hi,

This probably isn't an issue and is more of a "how-to".

I am trying to upgrade to AngularJS skeleton project to use ES6. My config currently turns off the module definition and wrapper:

  modules:
    definition: false
    wrapper: false

So far all I have installed for ES6 support is Babel Brunch (npm install --save babel-brunch). Since I will be using ES6 modules I have removed the above config. But after doing that I have noticed two issues:

• My vendor files ('javascript/vendor.js': /^bower_components/) still get all the module polyfill code e.g. endsWith, unalias and require defined at the top of the file.
• I am using angularjs-templates-brunch to produce my template file (joinTo: 'javascript/templates.js'). The template file now includes all of the polyfill code and each of my templates get wrapped up in modules like require.register("post/post.tpl", ... { . This means that I can't just require a templates module and I need to explicitly require each template module somewhere in my code so that it will execute code to declare the Angular module (angular.module('templates')):

require.register("posts/posts.tpl", function(exports, require, module) {
(function() {
    var module;

    try {
        // Get current templates module
        module = angular.module('templates');

Hopefully that makes some sense, so my questions are:

1. Is it correct that my app, vendor and template files are all defining the module polyfill code? Can Babel Brunch be configured to put that pollyfill code in a separate file?
2. How can I turn the module wrapping off for just my templates?
3. https://babeljs.io/docs/setup/ has the config property as ESbabel and not babel, are both correct?

[es128]

Why did you close this?