Which JSS version for Sitecore 10.2?

Question

I am trying to setup a JSS app on Sitecore 10.2 (with SXA) but that is not going as expected.

I checked the downloads page for Headless Rendering and that mentions version 20.0.2 as latest now compatible with Sitecore 10.2. This install went fine. Creating a headless site with SXA seems to have worked and our graphQL playground is working.

I assumed that for the actual front-end app I had to use the same version (https://sitecore.stackexchange.com/a/30563/237 confirms that) so I used "npx create-sitecore-jss@ver20 --templates nextjs,nextjs-sxa ..." to do a setup and that created a nextjs app for me. Did the rest of the setup and config deploys and that seemed to go well - but when I start the site I get an error: Cannot query field "site" on type "Query".

Apparently the RedirectsQuery is doing a graphQL query for "sites" which is not supported. If I try that in my graphQL-UI it is indeed not in the schema. It is as from 10.3 however.

So now I'm thinking I have some wrong version somewhere.. so the question is actually if anyone has an idea what version I should be using on a Sitecore 10.2?

Answer 1

Apparently the version what not the issue - but the parameters. Including nextjs-sxa appears to be only supported for XMCloud. Found that in some well hidden docs - although I must admit that if you don't use it you are asked to include it and it is very clearly mentioned in that case.

Lesson learned: use lesser parameters in the creation command and let the questions come to you..

Answer 2

• Yes for Sitecore 10.2 compatible version is version 20.0.2 which you are using. Check your frontend app if it has the same version. Try to uninstall the current version using the following command:

  npm uninstall -g @sitecore-jss/sitecore-jss-cli

• Then install the latest version:

  npm install -g @sitecore-jss/[email protected]

• Then create your app --

  npx create-sitecore-jss --templates nextjs --appName my-nextjs-app --fetchWith GraphQL

Answer 3

With Sitecore Headless Rendering version 20, you can install NextJS SXA, which is only compatible with XM cloud. It is mentioned when you install it using the command:

npx create-sitecore-jss@ver20

It will ask if you would like to include any add-on initializers:

Would you like to include any add-on initializers? (Press <space> to select, <a> to toggle all, <i> to invert selection, and <enter> to proceed)
 ( ) nextjs-styleguide - Includes example components and setup for working disconnected
>(*) nextjs-sxa - Includes example components and setup for SXA Headless (only compatible with Sitecore XM Cloud)

On the other hand, With version 21, you will get much more options. You can choose nextjs-sxa, it will include example components and setup for Headless SXA projects which is even compatible with non XM cloud headless setup.

 Would you like to include any add-on initializers? (Press <space> to select, <a> to toggle all, <i> to invert selection, and <enter> to proceed)
>( ) nextjs-styleguide - Includes example components and setup for working disconnected
 ( ) nextjs-styleguide-tracking - Includes example (Sitecore XP) tracking component
 ( ) nextjs-sxa - Includes example components and setup for Headless SXA projects
 ( ) nextjs-personalize - Includes example setup for projects using XM Cloud Embedded Personalization
 ( ) nextjs-multisite - Includes example setup for hosting multiple sites in a single NextJS application