9

Looks like Expo Webpack doesn't optional chaining.

I found this when I tried to install UI Kitten to Expo Web app.

This is the compile error after I added UI Kitten to the newly created Expo app

node_modules/@ui-kitten/components/ui/input/input.component.js 104:38
Module parse failed: Unexpected token (104:38)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders
|         this.webEventResponder = devsupport_1.WebEventResponder.create(this);
|         this.focus = () => {
>             this.textInputRef.current?.focus();
|         };
|         this.blur = () => {

Deps versions(latest ones at the moment that I'm writing here.)

  • expo@37.0.6
  • @ui-kitten/components@5.0.0-alpha.1

Any tips to hack around this?

sujameslin
  • 131
  • 6

2 Answers2

4

Webpack uses Acorn parser, and Acorn does not support optional chaining as of now.

There is a pending pull request which you can subscribe to to get notified about the progress.

So your workaround options are:

  • do not use webpack
  • do not use optional chaining
  • integrate Babel into your stack, and make sure to pass all *.js-files through Babel first, using this Babel plugin
  • wait for the aforementioned PR to be merged and the next version including this PR to be released
  • fork Acorn, merge the PR yourself, then fork webpack and make it use your forked Acorn
connexo
  • 41,035
  • 12
  • 60
  • 87
  • 4
    My ultimate goal is to install `UI Kitten` to Expo Web app. Is there anyway to hack around this issue? Maybe adding any other 3rd party webpack loader to configuration? Expo normally uses Babel but only for mobile build. For the web build, it uses `Webpack`. No way to avoid Webpack build in Expo. – sujameslin Apr 09 '20 at 15:24
1

As @connexo says, the workaround is to integrate a babel plugin. Also, this issue has already been discussed on the github.

artyorsh
  • 332
  • 1
  • 2
  • 6