[DO NOT MERGE] Upgrade to react router

[byrichardpowell]

How to use this PR

This PR shows how to upgrade an out of date version of the Shopify Remix app template to React Router that has not yet adopted Vite. It breaks changes into logical commits that follow the migrations guides:

• Adopt Vite in a Shopify Remix app
• Adopt Remix future flags
• Upgrading from Remix

If you want to understand each change, you can follow the commits in order. Alternatively, you can look at all the changes as one and copy them across to your app.

Most likely you won't need all the changes in this PR. The QR Code example hasn't kept up to date with the latest versions of @shopify/shopify-app-remix and you probably created your app after we created this one.

DO NOT MERGE

Keeping this open as a demonstration of upgrading an app from Remix to React Router

[Copilot]

Pull Request Overview

This PR migrates the Shopify Remix template to React Router v7 by replacing Remix-specific adapters, APIs, and configurations with React Router equivalents and updating the build toolchain to Vite.

• Switch server/client routing from Remix to React Router (imports, adapters, <ServerRouter>, loader/action returns)
• Update package.json scripts, dependencies (Vite build, type: "module", engines, React Router packages)
• Adjust route components, CSS handling, and error boundary to align with React Router conventions

Reviewed Changes

Copilot reviewed 27 out of 27 changed files in this pull request and generated 3 comments.

Show a summary per file

File	Description
react-router.config.ts	Added React Router dev server configuration
package.json	Updated scripts, added ESM, Vite build, React Router deps
app/shopify.server.js	Switched to React Router–compatible Shopify server adapter
app/routes/**/*.jsx	Replaced @remix-run/* imports with react-router, plain returns
app/routes/app._index.jsx	Import/update loader return, added headers export via boundary
app/routes/_index/route.jsx	Removed Remix links, updated redirect/form imports
app/routes.js	Introduced flatRoutes entry
app/root.jsx	Switched root imports to React Router, added lang="en"
app/entry.server.jsx	Replaced <RemixServer> with <ServerRouter>, updated timeout
.graphqlrc.js	Updated LATEST_API_VERSION import path

Comments suppressed due to low confidence (3)

app/routes/app._index.jsx:6

• You removed the links() export that injects the stylesheet; importing the URL alone won’t include it in the page. Consider re-adding a links() function that returns { rel: 'stylesheet', href: styles }.

import "./styles.css?url";

app/routes/qrcodes.$id.jsx:2

• The loader now returns a plain object instead of json. Add or update tests to verify that useLoaderData correctly receives title and image properties under React Router.

import { useLoaderData } from "react-router";

app/routes/_index/route.jsx:6

• The CSS import needs a corresponding links() export for React Router to add a <link> tag. Without it, your styles won’t load in the browser.

import "./styles.css?url";