[web] "Failed to compile" figwheel-bridge.js

Expo CLI 3.16.1 environment info:
System:
OS: Linux 5.3 Ubuntu 19.10 (Eoan Ermine)
Shell: 5.0.3 - /bin/bash
Binaries:
Node: 12.16.1 - ~/bin/node/bin/node
Yarn: 1.22.4 - ~/bin/node/bin/yarn
npm: 6.14.4 - ~/bin/node/bin/npm
npmPackages:
expo: ^34.0.3 => 34.0.4
react: 16.8.3 => 16.8.3
react-native: https://github.com/expo/react-native/archive/sdk-34.0.0.tar.gz => 0.59.8
npmGlobalPackages:
expo-cli: 3.16.1

I followed the “Using Clojurescript” tutorial right up until it said to run expo start --ios. Instead, I ran expo start:web.

Then I got this:

 web  Failed to compile.
/home/tim/src/ExpoWithAshton/your-project/js/figwheel-bridge.js
SyntaxError: /home/tim/src/ExpoWithAshton/your-project/js/figwheel-bridge.js: Unexpected token (76:20)

  74 |                 var plainStyle = {flex: 1, alignItems: 'center', justifyContent: 'center'};
  75 |                 return (
> 76 |                     <ReactNative.View style={plainStyle}>
     |                     ^
  77 |                         <ReactNative.Text>Waiting for Figwheel to load files.</ReactNative.Text>
  78 |                     </ReactNative.View>
  79 |                 );

It looks like this file is not getting transpiled from JSX to JS and I could not find any concrete examples of doing that. I tried the expo customize:web command to generate a webpack-config.js but I had no idea how to make it transpile my code.

If this is a common issue, adding it to the ‘Using Clojurescript’ tutorial would be much appreciated.

Hi. I last tried Expo’s ClojureScript guide before web support was added to Expo, so I can’t give you any help with that specifically. But I have found some shadow-cljs documentation on using it with Expo which is probably worth a try if you can’t get it to work using the ‘Using ClojureScript’ tutorial:

https://shadow-cljs.github.io/docs/UsersGuide.html#target-react-native

These are the options that you can pass in the configuration Object to start .

appName : (required) the name that you created your React Native project with.

optionsUrl : (optional) a url that will resolve to a cljsc_opts.json file. I modifed figwheel-main to output this file as a JSON version of the cljsc_opts.edn file that the ClojureScript compiler outputs. This contains all the information needed to effectively boostrap and load a ClojureScript application. If a optionsUrl is not supplied you will need to supply the asset-path , main , preloads , and closure-defines options directly.

renderFn : (optional) the JS munged name of the function that returns the React elements for your application - defaults to figwheel_rn_root

asset-path : (optional) this a url that resolves to the base of the :output-dir in most cases this is "http://localhost:8081/target/public/cljs-out/[[build-name]]" and in the current example this would be "http://localhost:8081/target/public/cljs-out/ios"

main : (optional) the JS munged namespaces string of your root application namespace ie. "my_example.core"

preloads : (optional) an array of JS munged namespace strings to load before the main ns is loaded.

closure-defines : (optional) a JavaScript Object literal that provides custom values for your goog-defines . Most importantly this should contain a figwheel.repl.connect_url so that figwheel-main knows where to connect.

This topic was automatically closed 20 days after the last reply. New replies are no longer allowed.