Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

@material-ui/core/colors/red.js

See original GitHub issue

> Build error occurred
/home/stas@i-npz.ru/Документы/portal/node_modules/@material-ui/core/colors/red.js:17
export default red;
^^^^^^

SyntaxError: Unexpected token 'export'
    at wrapSafe (internal/modules/cjs/loader.js:979:16)
    at Module._compile (internal/modules/cjs/loader.js:1027:27)
    at Object.Module._extensions..js (internal/modules/cjs/loader.js:1092:10)
    at Module.load (internal/modules/cjs/loader.js:928:32)
    at Function.Module._load (internal/modules/cjs/loader.js:769:14)
    at Module.require (internal/modules/cjs/loader.js:952:19)
    at require (internal/modules/cjs/helpers.js:88:18)

Tech	Version
Material-UI	v5.0.0-alpha.18
React	17
Browser	Google
TypeScript	4.1.2
etc.

Issue Analytics

State:
Created 3 years ago
Comments:5 (2 by maintainers)

Top GitHub Comments

4reactions

mnajdovacommented, Aug 3, 2021

@asibilia it’s expected for v5. See https://next.material-ui.com/guides/migration-v4/#jest-syntaxerror-unexpected-token-export

4reactions

jonnyasmarcommented, Mar 27, 2021

Sorry for resurrecting a closed thread, but I had this exact same issue and discovered that it had to do with using a default import of a color, e.g.

import primary from '@material-ui/core/colors/deepOrange';

Replacing this with the following, works just fine:

import { deepOrange as primary } from '@material-ui/core/colors';

I haven’t investigated further to figure out what the cause of this issue is, but hopefully it will help someone else who encounters this.

Top Results From Across the Web

Color - Material UI - MUI

Palette: A palette is a collection of colors, i.e. hues and their shades. MUI provides all colors from the Material Design guidelines. ·...

material-ui/core/colors/red.js · Issue #23877 - GitHub

import primary from '@material-ui/core/colors/deepOrange';. Replacing this with the following, works just fine:.

material-ui/core.Color.red JavaScript and Node.js code ...

Best JavaScript code snippets using @material-ui/core.Color.red(Showing top 14 results out of 1,395) · Most used @material-ui/core functions · Popular in ...

material-ui-colors - npm

Import material ui colors to your js project. ... Start using material-ui-colors in your project by running `npm i material-ui-colors`.

Material Design Colors, Color Palette | Material UI

Red · 68.5K · 92.9K ; Pink · 34.8K · 58.1K ; Purple · 22.2K · 40.1K ; Deep Purple · 20.3K ·...