stereobooster/react-snap

SyntaxError: Unexpected token '?'

bykiandra opened this issue ยท 13 comments

Bug Report

Current Behavior
I get the following error when I run npm run postbuild:

> react-snap

๐Ÿ”ฅ  pageerror at /: SyntaxError: Unexpected token '?'

โœ…  crawled 1 out of 1 (/)

I am trying to deploy the website on Netlify (it's currently live, building from an earlier commit here: https://bykiandra.netlify.app). However, Netlify can't build from any commit where the postbuild script exists.

I've tried looking for the error, but there's nothing amiss in my index.html file, and there are no errors in the console when I build and run my website locally.

Reproducible demo
Repo: https://github.com/bykiandra/home-bykiandra

Expected behavior/code
I'm expecting the script to run with no errors, and for Netlify to be able to build and host the website without any issue.

Possible Solution
I've gone through the other issues and tried some suggestions here and there, but nothing's worked so far. I'll continue fiddling and see if I can find a solution myself.

Same exact issue here, I found that adding "homepage": ".", to the root level of your package.json file will bypass the error. I don't think it's fixing the error completely because this allows react-snap to generate the HTML pages you'd expect but they are not rendered (all of them would have the same content as the default index.html page before rendering)

Lol this did not work for me. Using react-router & Vite. This fix passed the syntax error but only rendered my root page. Any documentation where I can define my routes statically? Does this even work with react-router? Should I join the masses and move to Next.js? Am I real?

(Of course I'm aware that this package isn't actively maintained and I don't expect anyone to have these answers. Simply joking.)

I hit this on a really old project and traced it to a google maps iframe embed URL (that had a question mark). Setting the following config helped me:

  "reactSnap": {
    "skipThirdPartyRequests": true,
    "preconnectThirdParty": false
  }

@brandonburkett did you find any solution ??

same issue with the question mark

I have fixed that issue by changing the
"reactSnap": {
"source": "/",
}, But then i get this : Failed to load module script: The server responded with a non-JavaScript MIME type of "text/jsx".

I guess it's an issue from using vite with react, I've recreated my project with plain create-react-app and it starts crawling the pages as intended with warnings.
When trying to deploy it on vercel It fails to launch chrome tho.

I'm also having this problem and I don't have a solution yet, I'm really tired

Anyone found solution for this ?

give me solution plz

give me solution plz
@RaviCodin
https://github.com/amanix007/react-snap
check my repo, and fork if needed see if its helpful for your case.

For me, specifying a target to lower the ECMAScript version worked. In my case in Vite config. If you use webpack, you may need to change different files.

import { defineConfig } from 'vite'
import react from '@vitejs/plugin-react'

// https://vitejs.dev/config/
export default defineConfig({
  plugins: [react()],
  build: {
    target: ['es2015'],
  }
})