Issues with Babel and Mocha: Using ES6 import system

Question

I am new to web development and Javascript and I'm struggling with getting Mocha to work with the ES6 module system. A lot of forums posts on this topic are a bit outdated.

I have tried various solutions posted here: Babel unexpected token import when running mocha tests.

However, it seems like the compiler error messages I am encountering are slightly different from those in most of the posts I've seen. I am wondering if my problem is somehow unrelated to babel and a syntax issue I have overlooked.

Errors from different types of imports

import 'mocha';
       ^^^^^^^

SyntaxError: Unexpected string

import { EdgeList } from "../src/packing/edgeList";
       ^

SyntaxError: Unexpected token {

package.json (relevant parts)

  "devDependencies": {
    "@babel/cli": "^7.10.4",
    "@babel/core": "^7.10.4",
    "@babel/plugin-transform-runtime": "^7.10.4",
    "@babel/polyfill": "^7.10.4",
    "@babel/preset-env": "^7.10.4",
    "@babel/preset-stage-2": "^7.8.3",
    "@babel/register": "^7.10.4",
    "@babel/runtime": "^7.10.4",
    "mocha": "^8.0.1",
    "parcel-bundler": "^1.12.4",
    "sass": "^1.23.3",
    "typescript": "^3.7.2"
  },
  "scripts": {
    "cleanup": "rm -rf .cache dist",
    "start": "parcel ./src/index.html --open",
    "build": "parcel build ./src/index.html",
    "dev": "npm run cleanup && npm run build",
    "test": "mocha --require @babel/register src/test/*"
  },
  "dependencies": {
    "@babel/polyfill": "^7.10.4",
    "@babel/runtime": "^7.10.4",
    "@types/aframe": "^0.8.4",
    "aframe": "~1.0.4",
    "package.json": "^2.0.1",
    "parcel-plugin-asset-copier": "^1.0.0",
    "pkg.json": "^2.0.7",
    "snoowrap": "^1.21.0"
  },

.babelrc

{
    "presets": ["@babel/env"],
    "plugins": [
        ["@babel/transform-runtime"]
    ]
}

test.js

import 'mocha';
import { EdgeList } from "../src/packing/edgeList";

UPDATE: For anyone who might have more flexibility with their choice of testing frameworks, a possible workaround is to use Jest instead. The setup was much faster and worked immediately (reference: Does Jest support ES6 import/export?).

Issues with Babel and Mocha: Using ES6 import system

0 Answers0