WebDriverIO - Cannot use import statement outside a module

I am currently following the documentation on WDIO's webpage to create a custom reporter:

https://webdriver.io/docs/customreporter

I have created the configuration file as follows:

const CustomReporter = require('./reporter/reporter.js')



exports.config = {
    // ...
    reporters: [
        /**
         * use imported reporter class
         */
        [CustomReporter, {
            someOption: 'foobar'
        }]
        /**
         * use absolute path to reporter
         */
        ['/path/to/reporter.js', {
            someOption: 'foobar'
        }]
    ],
    // ...
}

And have the following code in reporter.js:

import WDIOReporter from '@wdio/reporter'

export default class CustomReporter extends WDIOReporter {
    constructor(options) {
        /*
         * make reporter to write to the output stream by default
         */
        options = Object.assign(options, { stdout: true })
        super(options)
    }

    onTestPass(test) {
        this.write(`Congratulations! Your test "${test.title}" passed `)
    }
}

Whenever I run the code I get the following error:

    Cannot use import statement outside a module

I have babel setup with the default configuration file, however I have no idea if it is being used. Is there anyway I can check if it is being used?

Have I missed anything to get this working?