skip to Main Content

I have the following

import logo from './logo.svg';
import './App.css';
import AppBar from '@mui/material/AppBar';
...
import axios from "axios";
import { useState, useEffect } from 'react';
...
function App() {
}

Everything runs fine but when I try to run the tests I get…

 ({"Object.<anonymous>":function(module,exports,require,__dirname,__filename,jest){import axios from './lib/axios.js';
                                                                                      ^^^^^^

    SyntaxError: Cannot use import statement outside a module

       5 | import Typography from '@mui/material/Typography';
       6 | import Box from '@mui/material/Box';
    >  7 | import axios from "axios";
         | ^

If I remove the Axios code everything works fine, so why does it fail with the import?

2

Answers


  1. To fix this update your test command in your package.json to this : "test": "react-scripts test --transformIgnorePatterns 'node_modules/(?!axios)/'",. This error is because axios changed their module type from CommonJS TO ECMAScript in their v1.x.x and higher.

    Login or Signup to reply.
  2. I don’t know exactly but I think, it’s for the new update of Axios, you can see it in:

    https://github.com/axios/axios/issues/5101

    Login or Signup to reply.
Please signup or login to give your own answer.
Back To Top
Search