Coder Social home page Coder Social logo

importMDX Helper about gatsby-mdx HOT 5 CLOSED

avigoldman avatar avigoldman commented on August 17, 2024
importMDX Helper

from gatsby-mdx.

Comments (5)

ChristopherBiscardi avatar ChristopherBiscardi commented on August 17, 2024

mmm yeah, there's probably going to be something like this. My big question is how the other sources work. If you're querying the graphql for mdx, then presumably you could also send it through the webpack loader right? I'm not super familiar with the other source plugins though and we'd probably need the mime-db PR to operate on other sources. Do other sources get persisted to disk? Can we just require them? Then the graphql query is mostly for metadata (and filesystem location) and every works just like the "natural" way too.

but, mdx also works in the browser, so maybe instead of querying for the component, you query for the raw(ish) source (minus frontmatter) and the importMDX component just calls mdx.sync?

from gatsby-mdx.

avigoldman avatar avigoldman commented on August 17, 2024

I don't think this can function like other plugins since they source new nodes/fields into GraphQL, where we need to end up with a React component.

I like the idea of querying the source and then calling mdx.sync but I'm not sure that would play nicely with imports inside the MDX source.

from gatsby-mdx.

ChristopherBiscardi avatar ChristopherBiscardi commented on August 17, 2024

I'm actually having trouble coming up with a use case for being able to query the code and use it as a component. The ones I can come up with are overly convoluted and I can think of better ways to accomplish them (straight code imports, a structured JSON data, etc).

On the other hand, I do see a lot of use cases for being able to query the metadata (excerpts, time to read, etc).

Do you have a good use case in mind that we can target this functionality toward?

I also keep coming back to some kind of "createComponent" type API (similar to createPage, but I'd like to hear a solid use case first so I can focus my thoughts a bit better.

from gatsby-mdx.

avigoldman avatar avigoldman commented on August 17, 2024

The only example I can find where this would be used so far is the React website. They query multiple markdown files and use them to build each row of the home page. https://github.com/reactjs/reactjs.org/blob/master/src/pages/index.js#L404

But with MDX, it would be dramatically easier since they could import the files as components and skip the query.

I'm thinking that this might be a non-issue. Unless we can think of a good reason for this, I'm for closing this issue and removing the code GraphQL field.

from gatsby-mdx.

ChristopherBiscardi avatar ChristopherBiscardi commented on August 17, 2024

I'd hold off on removing the field. Maybe just have it there undocumented for some enterprising soul to find a solid use case (or my own experiments to find one lol).

The best argument I can see for this is that it's what users want to do and if they keep running into "this is how I expect it to work and it doesn't work this way" then we could put more effort into supporting it.

from gatsby-mdx.

Related Issues (20)

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.