Blog cannot render

[benbehringer]

Hi,

I followed the installation instructions for adding a blog (https://reflexjs.org/docs/blog)

Yet, the blog cannot render:

Any ideas?

Thanks Ben

[benbehringer]

I also receive this warning:

warn The GraphQL query in the non-page component "/project/node_modules/@reflexjs/gatsby-theme-post/src/tag-template.js" will not be run. Exported queries are only executed for Page components. It's possible you're trying to create pages in your gatsby-node.js and that's failing for some reason.

[shadcn]

Is this with posts or no post files? Can you see if adding a post with tags fixes it?

[benbehringer]

This is posts only (followed the instructions and added a post.). Pages work as expected.

[benbehringer]

Ah, it worked until I installed Disqus. Removed it, but it is still not working.

[shadcn]

Let me spin a new site and test.

From the error, it looks like a component is not returning properly.

[benbehringer]

gatsby build:

ERROR #95313 Building static HTML failed for path "/blog/" See our docs page for more info on this error: https://gatsby.dev/debug-html Error: Minified React error #152; visit https://reactjs.org/docs/error-decoder.html?invariant=152&args[]=Wrapper for the full message or use the non-minified dev environment for full errors and additional helpful warnings.

[shadcn]

Hmm I can't reproduce this with a new build. https://reflex-disqus.netlify.app/blog/2020-02-18-officiis-unde-dignissimos-molestias-ipsam-alias

Here's the post.js file: https://github.com/arshad/reflex-disqus/blob/master/src/%40reflexjs/gatsby-theme-post/post.js

Can you try removing any shadowed component and try gatsby clean && gatsby develop?

[benbehringer]

Arg, I already tried gatsby clean && gatsby develop without any luck. Will check your example, thanks!

[benbehringer]

I reverted package-lock.json and package.json and did an rm -rf node_modules && npm install. I couldn't figure out what went wrong, but I can access the blog now. Thanks for your time and help.

[benbehringer]

Nope. Worked just one gatsby develop. Now I get this error:

[benbehringer]

Here's my package.json

{
  "name": "gatsby-starter-base",
  "version": "0.1.13",
  "private": true,
  "license": "MIT",
  "scripts": {
    "build": "gatsby build",
    "start": "gatsby develop",
    "serve": "gatsby serve",
    "clean": "gatsby clean",
    "dev": "gatsby clean && gatsby develop",
    "preview": "gatsby build && gatsby serve"
  },
  "dependencies": {
    "@material-ui/core": "^4.11.0",
    "@material-ui/icons": "^4.9.1",
    "@palmabit/react-cookie-law": "^0.4.0",
    "@reflexjs/gatsby-plugin-metatags": "^0.2.8",
    "@reflexjs/gatsby-theme-base": "^0.3.12",
    "@reflexjs/gatsby-theme-post": "^0.6.8",
    "babel-plugin-styled-components": "^1.11.1",
    "chart.js": "^2.9.4",
    "fbjs": "^3.0.0",
    "formik": "^2.2.1",
    "formik-material-ui": "^3.0.0",
    "gatsby": "^2.24.85",
    "gatsby-image": "^2.4.21",
    "gatsby-plugin-anchor-links": "^1.1.1",
    "gatsby-plugin-favicon": "^3.1.6",
    "gatsby-plugin-force-trailing-slashes": "^1.0.4",
    "gatsby-plugin-htaccess": "^1.4.0",
    "gatsby-plugin-manifest": "^2.4.35",
    "gatsby-plugin-material-ui": "^2.1.10",
    "gatsby-plugin-matomo": "^0.8.3",
    "gatsby-plugin-mautic": "^1.0.0",
    "gatsby-plugin-module-resolver": "^1.0.3",
    "gatsby-plugin-nginx-redirect": "0.0.8",
    "gatsby-plugin-react-helmet": "^3.3.14",
    "gatsby-plugin-react-svg": "^3.0.0",
    "gatsby-plugin-remove-trailing-slashes": "^2.3.13",
    "gatsby-plugin-sharp": "^2.6.43",
    "gatsby-plugin-styled-components": "^3.3.14",
    "gatsby-remark-flowchart": "0.0.1",
    "gatsby-remark-images": "^3.3.39",
    "gatsby-source-mautic": "^0.7.5",
    "gatsby-theme-material-ui": "^1.0.13",
    "gatsby-transformer-remark": "^2.8.46",
    "gatsby-transformer-sharp": "^2.5.19",
    "react": "^16.14.0",
    "react-chartjs-2": "^2.10.0",
    "react-cookie-consent": "^5.2.0",
    "react-dom": "^16.14.0",
    "react-faq-component": "^1.2.1",
    "react-number-format": "^4.4.1",
    "react-tooltip": "^4.2.10",
    "react-typist": "^2.0.5",
    "styled-components": "^5.2.0",
    "theme-ui": "^0.3.1"
  },
  "devDependencies": {
    "@babel/plugin-syntax-jsx": "^7.12.1"
  }
}

[benbehringer]

cleaned everything again and gatsby develop now gives me:

[benbehringer]

The blog now appears on every second gatsby develop. Yet, the header and footer are not shown (only /blog and the posts). Moreover, if I add post-footer.mdx as detailed here, I receive the wrapper error (as shown in my first post). It is absolutely not clear to me what is causing the side effects.

Moreover, the <Image> tag is not working in posts.

[benbehringer]

Okay, I removed several unused packages and installed everything using yarn. It works now as expected. Still I got this message during installation:

[benbehringer]

Thanks! Closing this since it is probably not an reflexjs issue.