async-awaitgruntjsbabel-preset-envpresetgrunt-babel

Async await doesn't get compiled in Grunt


I am trying to compile my ES6+ code to vanilla js using Grunt task runner. I have purposely chosen Grunt over webpack and gulp because I just wanted to minify my js files.

I have successfully compiled my ES6 code to vanilla after running the code got an error saying generatorRuntime is not defined. After analysing the issue I could that my async and await code is giving the issue after it gets converted to vanilla js.

I have my code snippet of my gruntfile.js and package.json.

        babel: {
            options: {
                sourceMap: true
            },
            dist: {
                files: [{
                    "expand": true,
                    "cwd": "./htdocs/js/src",
                    "src": ["**/*.js"],
                    "dest": "./htdocs/js/compiled/",
                    "ext": ".js"
                }]
            }
        },
        //uglify will minify all the js files in js/src folder.
        uglify: {
            all_src : {
                options : {
                  sourceMap : true
                },
                files: [{
                    expand: true,
                    flatten: true,
                    cwd:'./htdocs/js/compiled',
                    src: '**/*.js',
                    dest: './htdocs/js/dist',
                    ext: '.min.js'
                }]
            }
        }
    grunt.loadNpmTasks('grunt-babel');
    grunt.loadNpmTasks('grunt-contrib-uglify');


Package.json

  "devDependencies": {
    "babel-core": "^6.26.3",
    "babel-preset-latest": "^6.24.1",
    "grunt": "^1.1.0",
    "grunt-babel": "^7.0.0",
    "grunt-cli": "^1.3.2",
    "grunt-contrib-uglify": "^4.0.1"  
},
  "babel": {
    "presets": [
      "latest"
    ]
  }


Solution

  • That's probably because the polyfills aren't getting shipped in your bundle. In your babel.options object inside Gruntfile, you can set

    presets: [['@babel/preset-env', { useBuiltIns: 'usage', corejs: 3 }]] and don't forget to include corejs as dependency in your project.

    npm install core-js --save