Gatsby build adds <!-- --> between string when build (SSR)
See original GitHub issueDescription
When I generate a compound string like this:
...
<td>{someTitle} {somethingElse}</td>
...
Gatsby turns this into:
<td>This is a title<!-- --> <!-- -->300</td>
Steps to reproduce
The issue does not appear when I use the current gatsby new bug-repro https://github.com/gatsbyjs/gatsby-starter-hello-world
. However, updating this repro to the latest version causes this error to appear when using build
or GATSBY_EXPERIMENTAL_FAST_DEV=true gatsby develop
. It does not happen when using gatsby develop
.
Gatsby gatsby-starter-hello-world uses:
├── gatsby@2.26.1
├── prettier@2.2.1
├── react@16.13.1
└── react-dom@16.13.1
✅-> String does not contain <!-- -->
Minimal repro: https://github.com/shi-rudo/bug-repro-older-no-string-error
Gatsby updated gatsby-starter-hello-world uses:
├── gatsby@2.31.1
├── prettier@2.2.1
├── react@16.14.0
└── react-dom@16.14.0
❌ -> String does now contain <!-- -->
Minimal repro: https://github.com/shi-rudo/bug-repro-string-bug
Expected result
<td>This is a title 300</td>
Actual result
<td>This is a title<!-- --> <!-- -->300</td>
Environment
System:
OS: macOS 10.15.7
CPU: (4) x64 Intel(R) Core(TM) i5-4570 CPU @ 3.20GHz
Shell: 3.2.57 - /bin/bash
Binaries:
Node: 14.5.0 - ~/.nvm/versions/node/v14.5.0/bin/node
Yarn: 1.22.0 - /usr/local/bin/yarn
npm: 6.14.10 - ~/.nvm/versions/node/v14.5.0/bin/npm
Languages:
Python: 3.7.6 - /Users/trex/opt/anaconda3/bin/python
Browsers:
Chrome: 87.0.4280.141
Edge: 88.0.705.50
Safari: 14.0.1
npmPackages:
gatsby: ^2.31.1 => 2.31.1
npmGlobalPackages:
gatsby-cli: 2.18.0
Issue Analytics
- State:
- Created 3 years ago
- Comments:5 (2 by maintainers)
Top Results From Across the Web
Gatsby Server Rendering APIs
The file gatsby-ssr.jsx / gatsby-ssr.tsx lets you alter the content of static HTML files as they are being Server-Side Rendered (SSR) by Gatsby...
Read more >GatsbyJS and Contentful with SSR - Stack Overflow
When you run gatsby build the site (HTML/CSS/JS) is built for you and outputted to the "public" directory. Try going through the official ......
Read more >How to add vanilla Emotion server-side rendering to Gatsby
In gatsby-ssr.js , we can add something like the following: import { cache } from '@emotion ...
Read more >Gatsby: The ultimate guide with examples - LogRocket Blog
js. Adding your site to Netlify is as simple as creating an account, linking your GitHub, and clicking the Create site from git...
Read more >Gatsby 4: Using SSR and DSG - Medium
With static generation or deferred static generation, Gatsby builds the website's files only once. With server-side rendering, however, a server ...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
with more complex layout it leads to strong malformations
edit: this phenomenon occurs when switching from react to preact.
Hey again!
It’s been 60 days since anything happened on this issue, so our friendly neighborhood robot (that’s me!) is going to close it. Please keep in mind that I’m only a robot, so if I’ve closed this issue in error, I’m
HUMAN_EMOTION_SORRY
. Please feel free to comment on this issue or create a new one if you need anything else. As a friendly reminder: the best way to see this issue, or any other, fixed is to open a Pull Request. Check out gatsby.dev/contribute for more information about opening PRs, triaging issues, and contributing!Thanks again for being part of the Gatsby community! 💪💜