storyblok / remix-ultimate-tutorial

7 stars 3 forks source link

Adding key={blok._uid} attribute on outer elements in components breaks the app #5

Closed FrozenFalcon closed 7 months ago

FrozenFalcon commented 2 years ago

I'm getting this error if I follow the example and add the key={blok._uid} attribute to the <main>, <div>, <ul> elements in the component files. If I remove this attribute everything works. The guide here doesn't explain the necessity of this attribute.

What's going on here?

Unexpected Server Error

Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: undefined. You likely forgot to export your component from the file it's defined in, or you might have mixed up default and named imports.

My package.json looks like this:

{
  "private": true,
  "sideEffects": false,
  "scripts": {
    "build": "remix build",
    "dev": "remix dev",
    "start": "remix-serve build"
  },
  "dependencies": {
    "@remix-run/node": "^1.7.2",
    "@remix-run/react": "^1.7.2",
    "@remix-run/serve": "^1.7.2",
    "@storyblok/react": "^1.3.2",
    "axios": "^0.27.2",
    "react": "^18.2.0",
    "react-dom": "^18.2.0"
  },
  "devDependencies": {
    "@remix-run/dev": "^1.7.2",
    "@remix-run/eslint-config": "^1.7.2",
    "@types/react": "^18.0.15",
    "@types/react-dom": "^18.0.6",
    "eslint": "^8.25.0",
    "typescript": "^4.8.4"
  },
  "engines": {
    "node": ">=14"
  }
}

I am using Typescript but that shouldn't cause this, right?

cbarratt commented 2 years ago

Also seeing this issue when using this as a boilerplate

alexadark commented 7 months ago

This tutorial has beed updated, this should not happen anymore