PrismicProvider - Cannot use import statement outside a module

Developing with Prismic
, ,
6

Hi @dhavalveera, @prismicio/react does not currently support pure ESM projects (the latest version is 2.8.0 as of this message).

The current published version is configured to maximize support for the most popular frameworks, including Next.js. That does not include the default Remix configuration, unfortunately. We are planning to reassess how we publish @prismicio/react and other Prismic packages in the near future to better support modern frameworks.

Until we make those changes, you can fix the package locally using patch-package.

  1. In the root of your project, create a file at patches/@prismicio+react+2.8.0.patch with this content:

    diff --git a/node_modules/@prismicio/react/package.json b/node_modules/@prismicio/react/package.json
index 45f1371..f2a7112 100644
--- a/node_modules/@prismicio/react/package.json
+++ b/node_modules/@prismicio/react/package.json
@@ -16,6 +16,7 @@
 	"license": "Apache-2.0",
 	"author": "Prismic <contact@prismic.io> (https://prismic.io)",
 	"sideEffects": false,
+	"type": "module",
 	"exports": {
 		".": {
 			"react-server": {

  2. Add a postinstall script to your package.json:

    {
  "scripts": {
    "postinstall": "patch-package"
  }
}

  3. Install patch-package:

    npm install --save-dev patch-package

Please note we do not officially support Remix. You can still use Prismic with Remix, but Next.js, Nuxt, or SvelteKit will offer the best Prismic experience. I recommend at least checking out our Next.js starters and docs to get some inspiration on how we recommend using Prismic. :slight_smile: