Shopify/shopify-app-template-node

Error Upgrading @Shopify/Polaris And React In Shopify App Development

ayushmukho opened this issue · 2 comments

ayushmukho commented

Issue summary

New to Shopify App Development. I was trying SHOPIFY APP CLI with Node. It's Polaris version is 10.49.1. I wanted to upgrade it to the latest (12.1.1) but couldn't. I need to upgrade react as well. Upgrading React to the latest causes new set of problems

  • @shopify/shopify-app-express version: "^2.1.3"
  • Node version: "v20.8.0"
  • Operating system: "macos"

Expected behavior

Updated to the latest polaris version and also the latest react version

Actual behaviour

If we update it breaks everything

lizkenyon commented

Hi there 👋

Thanks for flagging. The team will review this and look into updating some of the dependencies.

If you are new to Shopify development, I would recommend looking into the Remix template. There is a lot more documentationavailable for that template.

keburius commented

Hello @ayushmukho👋,

I encountered the same issue and resolved it as follows:

  1. Update Polaris to the latest version:
    "@shopify/polaris": "^12.19.2"
  2. Update React and ReactDOM to version 18 or later:
    "react": "^18.2.0", "react-dom": "^18.2.0"

After these updates, I encountered an issue with ReactDOM.render, as it is no longer supported in React 18. To address this, I switched to using createRoot instead:

`import { createRoot } from "react-dom/client";
import App from "./App";
import { initI18n } from "./utils/i18nUtils";

initI18n().then(() => {
const root = createRoot(document.getElementById("app"));
root.render();
});`

I hope this helps you! 😊

  • 👍1