Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[react-constant-elements] Unexpected token. Hoisting elements into imports, breaking source #9965

natew opened this issue May 10, 2019 · 2 comments


None yet
3 participants
Copy link

commented May 10, 2019

Bug Report

I really should make repro's, but I'm sort of overextended even just opening tickets. This one though it happening to me on latest everything:

ERROR in ./src/pages/OrbitPage/OrbitHeader.tsx 14:22
Module parse failed: Unexpected token (14:22)
You may need an appropriate loader to handle this file type.
| import { OrbitSpaceSwitch } from '../../views/OrbitSpaceSwitch';
| import { OrbitHeaderInput } from './OrbitHeaderInput';
> import { _ref2 } from (HeaderButtonPassProps, {}, void 0, _jsx(BackButton, {}), _jsx(OrbitHeaderMenu, {}));
| from;
| './OrbitHeaderMenu';
 @ ./src/pages/OrbitPage/OrbitPage.tsx 23:0-44 58:17-28
 @ ./src/OrbitRoot.tsx
 @ ./src/main.tsx

from a source file that roughly has:

import { invertLightness } from '@o/color'
import { Icon, useActiveAppsSorted, useLocationLink } from '@o/kit'
import { isEditing } from '@o/stores'
import { BorderBottom, Button, ButtonProps, Popover, PopoverProps, Row, Space, SurfacePassProps, View } from '@o/ui'
import { FullScreen, gloss, useTheme } from 'gloss'
import React, { forwardRef, memo } from 'react'

import { useStores } from '../../hooks/useStores'
import { useOm } from '../../om/om'
import { OrbitSpaceSwitch } from '../../views/OrbitSpaceSwitch'
import { OrbitHeaderInput } from './OrbitHeaderInput'
import { OrbitHeaderMenu } from './OrbitHeaderMenu'
import { OrbitNav } from './OrbitNav'

// ..

export function View() {
  return (<HeaderButtonPassProps><BackButton />{/* ... */}<OrbitHeaderMenu /></HeaderButtonPassProps>)

const HeaderButtonPassProps = styled.div()
const BackButton = styled.div()

Current Behavior

It's not happening on every element, and in testing it in a lot of cases I can't see what actually triggers it. Some files are fine, others have this error. I've binary searched a file down, but again, it didn't really make sense how.


  • Babel version(s): 7.4.4
  • Node/npm version: 11
  • OS: Mojave
  • Monorepo: yes/lerna


@babel/preset-env {
          loose: true,
          modules: false,
          targets: {
            chrome: '74',
            esmodules: true,

as well as


Possible Solution

I'll try and investigate more. The constant-element plugin makes a huge difference for performance.

Next try will be binary searching plugins.

Additional context/Screenshots
Add any other context about the problem here. If applicable, add screenshots to help explain.


This comment has been minimized.

Copy link

commented May 10, 2019

Hey @natew! We really appreciate you taking the time to report an issue. The collaborators
on this project attempt to help as many people as possible, but we're a limited number of volunteers,
so it's possible this won't be addressed swiftly.

If you need any help, or just have general Babel or JavaScript questions, we have a vibrant Slack
that typically always has someone willing to help. You can sign-up here
for an invite.

@natew natew changed the title react-constant-elements is hoisting elements into imports, breaking source [react-constant-elements] Unexpected token. Hoisting elements into imports, breaking source May 10, 2019


This comment has been minimized.

Copy link

commented May 13, 2019

I get this error for that code:

/repl: Identifier 'View' has already been declared (17:16)

  15 | // ..
  16 | 
> 17 | export function View() {
     |                 ^
  18 |   return (<HeaderButtonPassProps><BackButton />{/* ... */}<OrbitHeaderMenu /></HeaderButtonPassProps>)
  19 | }
  20 | 
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.