TypeError: Cannot read property 'link' of undefined

Hello Frontity Community,
I followed the Quick Start guide and in frontity.settings.js the starter blog source API works just fine but when I change it to http://wordpress-195297-996659.cloudwaysapps.com/wp-json I’m getting errors. In the browser I just see “Internal Server Error”. In the command prompt I see:

C:\my-app>npx frontity dev

SERVER STARTED – Listening @ http://localhost:3000

  • mode: development
  • target: module
webpack built client 8b9c148751814d2ac481 in 2080ms
i 「wdm」: Child client:
               Asset      Size  Chunks             Chunk Names
      list.module.js  17.6 KiB    list  [emitted]  list
    my-app.module.js  3.34 MiB  my-app  [emitted]  my-app
     + 1 hidden asset
Child server:
        Asset     Size  Chunks             Chunk Names
    server.js  5.7 MiB    main  [emitted]  main
i 「wdm」: Compiled successfully.

  TypeError: Cannot read property 'link' of undefined
      at Item (webpack-internal:///./packages/mars-theme/src/components/list/list-item.js:9:579)
      at runAsReaction (webpack-internal:///./node_modules/@frontity/connect/src/reactionRunner.js:16:45)
      at reaction (webpack-internal:///./node_modules/@frontity/connect/src/observer.js:7:131)
      at props (webpack-internal:///./node_modules/@frontity/connect/src/connect.js:18:8)
      at processChild (webpack-internal:///./node_modules/react-dom/cjs/react-dom-server.node.development.js:505:2392)
      at resolve (webpack-internal:///./node_modules/react-dom/cjs/react-dom-server.node.development.js:504:122)
      at ReactDOMServerRenderer.render (webpack-internal:///./node_modules/react-dom/cjs/react-dom-server.node.development.js:541:855)
      at ReactDOMServerRenderer.read (webpack-internal:///./node_modules/react-dom/cjs/react-dom-server.node.development.js:541:55)
      at renderToString (webpack-internal:///./node_modules/react-dom/cjs/react-dom-server.node.development.js:576:116)
      at app.use (webpack-internal:///./node_modules/@frontity/core/src/server/index.tsx:47:243)

In other threads I saw you had someone run npx frontity info. Not sure if it will help or not, but here is that information:

System:

  • OS: Windows 10
  • CPU: (8) x64 Intel® Core™ i7-7700 CPU @ 3.60GHz
  • Memory: 8.44 GB / 15.92 GB

Binaries:

  • Node: 10.14.0 - C:\Program Files\nodejs\node.EXE
  • npm: 6.4.1 - C:\Program Files\nodejs\npm.CMD

Browsers:

  • Edge: 44.18362.329.0
  • Internet Explorer: 11.0.18362.1

npmPackages:

  • @frontity/core: ^1.2.1 => 1.2.1
  • @frontity/html2react: ^1.1.11 => 1.1.11
  • @frontity/mars-theme: ./packages/mars-theme => 1.2.0
  • @frontity/tiny-router: ^1.0.14 => 1.0.14
  • @frontity/wp-source: ^1.3.1 => 1.3.1
  • frontity: ^1.3.1 => 1.3.1

npmGlobalPackages:

  • frontity: Not Found
  • npx: Not Found

It looks like access to the /users endpoint of your REST API is restricted and returns an error.

That means your author has an id of 1, but the REST API returns a 404:

// http://wordpress-195297-996659.cloudwaysapps.com/wp-json/wp/v2/users/1
{
  code: "rest_user_invalid_id",
  message: "Invalid user ID.",
  data: {
    status: 404
  },
}

Do you have any security plugin installed?

To solve the issue, you can either allow your REST API to retrieve information about authors or remove the author’s code from the theme in both posts and lists:

Or you can make it optional:

<>
  {author && (
    <StyledLink link={author.link}>
      <Author>
        By <b>{author.name}</b>
      </Author>
    </StyledLink>
  )}
  <...>
</>;

We are going to improve our starter theme to do precisely that and avoid this problem in the future. Thanks for reporting (https://github.com/frontity/frontity/pull/203)

@luisherranz Making it optional in both files did the trick. Thank you so much!

2 Likes

Do you know why your authors are not exposed in the REST API? Are you using any security plugin?

I had the same issue some time ago. It was caused by WordFence Security plugin. If you go to WordFence -> All options -> Additional options this one is enabled by default:

Prevent discovery of usernames through '/?author=N' scans, the oEmbed API, and the WordPress REST API

Just disabling it you can access the users endpoint and the problem is solved.

1 Like

Yeah, it was WordFence.

2 Likes