SyntaxError: Unexpected identifier with mocha and babel

Question

I have a mocha test file ( test/test.js ) that starts like this, using ES6 module syntax:

import {promises as fs} from 'fs'
import stepToD3 from '../src/StepToD3'
import assert from "assert"

In addition, I have a babel.config.js file in the root of my project:

module.exports = {
    presets: [
        "@vue/app",
        "@babel/preset-env"
    ]
}

I then want to test this using Mocha, transpiled through babel. I do so using mocha --require @babel/register test/test.js . However, somewhere during the execution, this fails with the following error:

/home/michael/Programming/cola-step/node_modules/@babel/runtime-corejs2/helpers/esm/asyncToGenerator.js:1
(function (exports, require, module, __filename, __dirname) { import _Promise from "../../core-js/promise";
                                                                     ^^^^^^^^

SyntaxError: Unexpected identifier
    at new Script (vm.js:84:7)
    at createScript (vm.js:264:10)
    at Object.runInThisContext (vm.js:312:10)
    at Module._compile (internal/modules/cjs/loader.js:684:28)
    at Module._compile (/home/michael/Programming/cola-step/node_modules/pirates/lib/index.js:83:24)
    at Module._extensions..js (internal/modules/cjs/loader.js:732:10)
    at Object.newLoader [as .js] (/home/michael/Programming/cola-step/node_modules/pirates/lib/index.js:88:7)
    at Module.load (internal/modules/cjs/loader.js:620:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:560:12)
    at Function.Module._load (internal/modules/cjs/loader.js:552:3)
    at Module.require (internal/modules/cjs/loader.js:657:17)
    at require (internal/modules/cjs/helpers.js:22:18)
    at Object.<anonymous> (/home/michael/Programming/cola-step/test/test.js:7:49)
    at Module._compile (internal/modules/cjs/loader.js:721:30)
    at Module._compile (/home/michael/Programming/cola-step/node_modules/pirates/lib/index.js:83:24)
    at Module._extensions..js (internal/modules/cjs/loader.js:732:10)
    at Object.newLoader [as .js] (/home/michael/Programming/cola-step/node_modules/pirates/lib/index.js:88:7)
    at Module.load (internal/modules/cjs/loader.js:620:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:560:12)
    at Function.Module._load (internal/modules/cjs/loader.js:552:3)
    at Module.require (internal/modules/cjs/loader.js:657:17)
    at require (internal/modules/cjs/helpers.js:22:18)
    at /usr/lib/node_modules/mocha/lib/mocha.js:231:27
    at Array.forEach (<anonymous>)
    at Mocha.loadFiles (/usr/lib/node_modules/mocha/lib/mocha.js:228:14)
    at Mocha.run (/usr/lib/node_modules/mocha/lib/mocha.js:536:10)
    at Object.<anonymous> (/usr/lib/node_modules/mocha/bin/_mocha:573:18)
    at Module._compile (internal/modules/cjs/loader.js:721:30)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:732:10)
    at Module.load (internal/modules/cjs/loader.js:620:32)
    at tryModuleLoad (internal/modules/cjs/loader.js:560:12)
    at Function.Module._load (internal/modules/cjs/loader.js:552:3)
    at Function.Module.runMain (internal/modules/cjs/loader.js:774:12)
    at executeUserCode (internal/bootstrap/node.js:342:17)
    at startExecution (internal/bootstrap/node.js:276:5)
    at startup (internal/bootstrap/node.js:227:5)
    at bootstrapNodeJSCore (internal/bootstrap/node.js:743:3)

Why is this failing to understand the ES6 import syntax if I'm using Babel? What is going wrong here?

Answer 1

In this case, I was running my tests with mocha on NodeJS, but my babel.config.js was set up to produce code for the browser. To fix this, I had to create two different babel settings, and then export the right NODE_ENV value before running the appropriate command (eg NODE_ENV=test mocha --require @babel/register for tests, and NODE_ENV=production for my webpack production build).

This is my new babel.config.js :

module.exports = {
    'env': {
        'production': {
            'presets': [
                [
                    '@vue/app',
                    {
                        // "modules": false,
                        'targets': ['ie >= 9']
                    },
                    '@babel/env'
                ]
            ],
            'comments': false
        },
        'test': {
            'presets': [
                [
                    '@babel/env',
                    {'targets': {'node': 'current'}}
                ]
            ]
        }
    }
}