Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Create mdx playground #23

Draft
wants to merge 7 commits into
base: next
Choose a base branch
from
Draft

Create mdx playground #23

wants to merge 7 commits into from

Commits on Feb 2, 2023

  1. Add necessary dependencies for MDX playground 

    + We need to downgrade the React version because @mdx/runtime
  requires React v16. This has no impact on our Docusaurus output
    @hs-saunved
    hs-saunved committed Feb 2, 2023
    Configuration menu
    Copy the full SHA
    bf329b7 View commit details
    Browse the repository at this point in the history

  2. Create a plugin to polyfill Node dependencies in webpack 

    + Since the playground requires node polyfills (due to MDX runtime)
  this is a must for enabling those deps
+ This plugin will be disabled for production builds to avoid
  bloating the final output
    @hs-saunved
    hs-saunved committed Feb 2, 2023
    Configuration menu
    Copy the full SHA
    cb54a84 View commit details
    Browse the repository at this point in the history

  3. Enable some Tailwind styles by default on preview/development environ… 

    …ments

+ Margin, padding classes are enabled as spacing helpers
+ Since Tailwind doesn't include unused classes, we will have to
  add these during previews or development for a better
  playground experience
    @hs-saunved
    hs-saunved committed Feb 2, 2023
    Configuration menu
    Copy the full SHA
    26b5c33 View commit details
    Browse the repository at this point in the history

  4. Create the live playground 

    + This is fully experimental, but it gives a good enough preview
  for most common use cases. Users should be able to use this
  to avoid local setups for making paragraph or even document-level
  changes
+ All forDocs plugins are injected into the MDX component's scope
  by default for an easier experience
+ This plugin will not load in our production environment to avoid
  bloating the final bundle
    @hs-saunved
    hs-saunved committed Feb 2, 2023
    Configuration menu
    Copy the full SHA
    b175807 View commit details
    Browse the repository at this point in the history

  5. Add mdx-js/mdx instead of mdx runtime

    @hs-saunved
    hs-saunved committed Feb 2, 2023
    Configuration menu
    Copy the full SHA
    1a9fca4 View commit details
    Browse the repository at this point in the history

  6. Fix live preview for client-side builds 

    + The MDX runtime module was not building properly with webpack
+ Had to go on a slightly lower level and use the MDX library directly
+ Handled some exception/error cases
    @hs-saunved
    hs-saunved committed Feb 2, 2023
    Configuration menu
    Copy the full SHA
    a59a04a View commit details
    Browse the repository at this point in the history

  7. Add a toolbar to the playground for examples

    @hs-saunved
    hs-saunved committed Feb 2, 2023
    Configuration menu
    Copy the full SHA
    f1b540a View commit details
    Browse the repository at this point in the history