error "gatsby-plugin-mdx" threw an error while running the onCreateNode lifecycle: #25734
Comments
gatsbot
bot
added
the
status: triage needed
blainekasten
added
type: question or discussion
|
This looks like invalid JavaScript. Is this from a file you wrote? If so you just need to fix your code |
|
debugging..... close it for the time being, |
|
@blainekasten I have exactly same problem after update The error from
|
|
@Lukespacewalker can you test the intermediate version numbers for me? It would help to nail down where this was introduced. 1.2.23, 1.2.24 |
|
@blainekasten Version 1.2.23 1.2.24, and 1.2.26 also have same error. |
|
Same Error Version"babel-preset-gatsby":{
"version": "0.5.2",
},
"gatsby": {
"version": "2.24.3"
},
"gatsby-cli": {
"version": "2.12.61"
},
"gatsby-core-utils": {
"version": "1.3.12",
},
"gatsby-graphiql-explorer": {
"version": "0.4.11",
},
"gatsby-legacy-polyfills": {
"version": "0.0.2",
},
"gatsby-link": {
"version": "2.4.13",
},
"gatsby-page-utils": {
"version": "0.2.17",
},
"gatsby-plugin-alias-imports": {
"version": "1.0.5",
},
"gatsby-plugin-compile-es6-packages": {
"version": "2.1.0",
},
"gatsby-plugin-emotion": {
"version": "4.3.10",
},
"gatsby-plugin-less": {
"version": "3.2.9",
},
"gatsby-plugin-mdx": {
"version": "1.2.26",
},
"gatsby-plugin-page-creator": {
"version": "2.3.17",
},
"gatsby-plugin-react-helmet-async": {
"version": "1.0.16",
},
"gatsby-plugin-root-import": {
"version": "2.0.5",
},
"gatsby-plugin-typescript": {
"version": "2.4.15",
},
"gatsby-react-router-scroll": {
"version": "3.0.12",
},
"gatsby-recipes": {
"version": "0.1.52",
} |
|
Hmmm, any chance anyone can create a minimal reproduction repo for debugging? I tried to copy over the MDX content that @Lukespacewalker provided and it doesn't seem to be reproducible on the latest version of |
johno
added
topic: MDX
and removed
type: question or discussion
johno
added
the
status: awaiting author response
|
I'm sorry, this report flew under my radar. I believe the trailing semi-colon problem was fixed forward shortly after publishing this version (#25639). Can you confirm this is still a problem now? The fix may not have been complete, although I thought it was quite thorough. |
|
Going to close it. If this bug was NOT fixed then please do re-open it. Thanks for reporting it! |
|
@pvdz It's still not fixed. I test with gatsby-plugin-mdx 1.2.30 and it still throws the error revert back to 1.2.22 fixing the issue. |
|
@pvdz @johno @blainekasten |
|
Mmmmm okay. This is some non-standard syntax since JS (ES6+) does not allow you to export things this way. I can probably work around it but need to know what the expected syntax is here. Is it "just" a string? And then what, how does that affect exported symbols and what not? The thing that was changed here was how exported symbols are collected. Before they were extracted with a full but very expensive Babel step. After they are assumed to be valid JS (ES6+ exports have a very limited syntax). Does exporting this way also include exporting all its symbols or how does it affect that? |
|
Nevermind. That syntax is generated becasue the new import scanner does not handle this case well: import "./foo.css"Fixing forward. Thank you for reporting. 💜 |
The "shorthand" syntax is an import that only imports a path, without declaring any symbols: ```js import "./foo.css" ``` This happened in the real world so we have to support it. This fixes #25734
The "shorthand" syntax is an import that only imports a path, without declaring any symbols: ```js import "./foo.css" ``` This happened in the real world so we have to support it. This fixes #25734
The "shorthand" syntax is an import that only imports a path, without declaring any symbols: ```js import "./foo.css" ``` This happened in the real world so we have to support it. This fixes gatsbyjs/gatsby#25734
The "shorthand" syntax is an import that only imports a path, without declaring any symbols: ```js import "./foo.css" ``` This happened in the real world so we have to support it. This fixes gatsbyjs/gatsby#25734
The "shorthand" syntax is an import that only imports a path, without declaring any symbols: ```js import "./foo.css" ``` This happened in the real world so we have to support it. This fixes gatsbyjs/gatsby#25734
|
Please try gatsby-plugin-mdx@1.2.32 and let me know if that fixed it (or not) |
|
@pvdz I have updated the minimal reproduction repo to gatsby-plugin-mdx@1.2.32. the import is working now import "./foo.css"but the export is stop working. I have check GraphQL query of minimal reproduction repo Reverting back to 1.2.22 fix the problem instantly. (I have run |
|
@johno weren't exports supposed to be required to be on one line? |
|
Confusing. On 1.2.22 the mdxnode looks like this node = {
id: "759a9ad5-424e-5ca2-ad9d-e2487c49a993",
children: [],
parent: "84bbff75-233f-52fb-a52e-69bb490180d5",
internal: {
content:
'import "./style.css"\nexport const frontmatter = {\n title: "gatsby-plugin-mdx bug"\n}\n\n<div>There should be a H1 tag containing "gatsby-plugin-mdx bug"</div>\n\n<div className="bg">\n <div className="red">This text is red and the background is whitish red.</div>\n</div>\n\n',
type: "Mdx",
},
frontmatter: { title: "gatsby-plugin-mdx bug" },
excerpt: undefined,
exports: {},
rawBody:
'import "./style.css"\nexport const frontmatter = {\n title: "gatsby-plugin-mdx bug"\n}\n\n<div>There should be a H1 tag containing "gatsby-plugin-mdx bug"</div>\n\n<div className="bg">\n <div className="red">This text is red and the background is whitish red.</div>\n</div>\n\n',
fileAbsolutePath:
"~/gatsby/sites/mdx-importexport-25734/src/contents/bug.mdx",
}This is 1.2.32: node = {
id: "759a9ad5-424e-5ca2-ad9d-e2487c49a993",
children: [],
parent: "84bbff75-233f-52fb-a52e-69bb490180d5",
internal: {
content:
'import "./style.css"\nexport const frontmatter = {\n title: "gatsby-plugin-mdx bug"\n}\n\n<div>There should be a H1 tag containing "gatsby-plugin-mdx bug"</div>\n\n<div className="bg">\n <div className="red">This text is red and the background is whitish red.</div>\n</div>\n\n',
type: "Mdx",
contentDigest: "f7e58b8743c8135e430270d754d52c60",
},
excerpt: undefined,
exports: [
'export const frontmatter = {\n title: "gatsby-plugin-mdx bug"\n}',
],
rawBody:
'import "./style.css"\nexport const frontmatter = {\n title: "gatsby-plugin-mdx bug"\n}\n\n<div>There should be a H1 tag containing "gatsby-plugin-mdx bug"</div>\n\n<div className="bg">\n <div className="red">This text is red and the background is whitish red.</div>\n</div>\n\n',
frontmatter: { title: "" },
fileAbsolutePath:
"~/gatsby/sites/mdx-importexport-25734/src/contents/bug.mdx",
}This is the diff: https://gist.github.com/pvdz/5ae1c7b0f4447251b642c4bfcfd65d57/revisions#diff-39859e34161f0cb6f5f50974282a2593 I guess the frontmatter export is explicitly extracted, transformed, handled ,etc? Need to dig further. |
|
Ok, we're going to revert this change, again, and leave it as before, for now. See referenced PR for details. |
|
This was reverted in gatsby-plugin-mdx@1.2.33 and I have no plans to attempt it again at this time. Very unfortunate as it saved minutes at bootstrap time with somewhat larger sites, but I now have other priorities. I'm pretty sure this can be done so if someone wants to pick this up lemme know and I can give some pointers. |
|
FYI: the same improvement has been merged behind a If your site depends on the Babel transform then there's nothing I can do here. But if the export parser is not catching a particular edge case then I'd be more than happy to fix forward to support it. |
|
[HELP NEEDED] Hi, I'm not sure if I was one of the edge cases, but I found this thread after encountering the same error after updating to the latest version of Gatsby and MDX Plugin. What I am trying to understand is, I didn't use Babel before in my project, and I assumed Gatsby has been taken care of it in the background. If the root cause is true as the error code suggests, Where should I place the options and presets? Currently, I placed it in package.json and it is not working. Build ErrorThis is the error I have now in my repo. https://github.com/desktopofsamuel/wave I have @babel/plugin-syntax-logical-assignment-operators installed as a part of Before that, I used to receive an error like: Previous ErrorsThings that I have attempted to find the cause
I have mixed and matched all 3 directions already trying each combination. The reason why it is in the master branch is it passed the build for Gatsby Cloud pull request merge but the build failed to deploy, and I'm stuck ever since, committing even more patch and attempted to rolling back the previous stable version with fail. Feel free to replicate the repo and try. https://github.com/desktopofsamuel/wave My package.jsonMy Repo Info |
|
For future folks that got here still having this issue, hopefully an upgrade is feasible for you. In my case, I got here through import * as style from './style.css'; |
The "shorthand" syntax is an import that only imports a path, without declaring any symbols: ```js import "./foo.css" ``` This happened in the real world so we have to support it. This fixes gatsbyjs/gatsby#25734
error "gatsby-plugin-mdx" threw an error while running the onCreateNode lifecycle:
unknown: Unexpected token (5:49)
3 | import * as React from 'react'
4 |
The text was updated successfully, but these errors were encountered: