jxnblk / mdx-go Goto Github PK

View Code? Open in Web Editor NEW

363.0 5.0 28.0 1.52 MB

:zap: Lightning fast MDX-based dev server for progressive documentation

Home Page: https://mdx-go.now.sh

License: MIT License

JavaScript 99.35% Dockerfile 0.65%

react mdx markdown js zero-config development documentation design style-guide design-systems

mdx-go's People

Contributors

Stargazers

Watchers

mdx-go's Issues

Difference between mdx-go and x0

I've just discovered this repo and wanted to ask -- what's the difference between this project and x0?

Support for custom webpack config

Is there a way to replace the template used in HTMLPlugin?

I've got a script that needs to be loaded in the head before the <App /> is rendered. The library I'm trying to load a sets a global variable. When trying to pass that variable as a prop to a component in the MDX file, timing conflicts with <Head /> result in the variable being undefined during the time that the component is processing. This seems like a race condition. Shouldn't the <Head /> component in <Root /> always be resolved first?

However, when I hack up the defaultTemplate in HTMLPlugin to hard-code my script in the actual head, then the page works as expected.

Therefore, it seems like I need to replace the HTMLPlugin's template with my own custom version, but I don't see a way to do that through the local webpack.config.js.

My dirty workaround is to install mdx-go into the local project dir, and apply a patch directly to defaultTemplate. I'd like to avoid that if possible.

Any ideas?

Support Sub-Resources URLs for images

Would be great, if you could put images you'd like to refer to in an article right inside the folder where the file for the article is and then refer to it with a sub-resource URL as described here under "Relative URLs": https://developer.mozilla.org/en-US/docs/Learn/Common_questions/What_is_a_URL#examples_of_relative_urls

You already support such Routes for links to other articles, but not for images, so it would also be consistent.

File Structure:

- root
  - main
    - sub
      - index.mdx
      - image.png

image markdown:

![my image](image.png)

Failed to compile, unexpected character '#'

I've been trying to get this to work for a while now but, unfortunately, I haven't had the luck.
Firstly, the directory structure looks like this:

├── docs
│   └── res.mdx
├── node_modules
│   ├── bloomer
│   ├── classnames
│   └── tslib
├── package.json
└── package-lock.json

I cd to this directory and run mdx-go docs and get the following error:

➜ mdx-go docs 
[mdx-go] starting dev server...
✔ success [mdx-go] compiled in 1s 848ms


 ERROR  Failed to compile with 1 errors                                 19:30:57

 error  in /home/karan/.nvm/versions/node/v8.11.4/lib/node_modules/mdx-go/lib/client/keyboard-shortcuts.md

Module parse failed: Unexpected character '#' (2:0)
You may need an appropriate loader to handle this file type.
| 
> ### Keyboard Shortcuts
| 
| - `/`: Show directory listing

 @ /home/karan/.nvm/versions/node/v8.11.4/lib/node_modules/mdx-go/lib/client/routes.js 11:0-56 44:26-43
 @ /home/karan/.nvm/versions/node/v8.11.4/lib/node_modules/mdx-go/lib/client/App.js
 @ /home/karan/.nvm/versions/node/v8.11.4/lib/node_modules/mdx-go/lib/client/index.js
 @ multi webpack-hot-middleware/client /home/karan/.nvm/versions/node/v8.11.4/lib/node_modules/mdx-go/lib/client/index.js

✖ ｢wdm｣: 
ERROR in ./client/keyboard-shortcuts.md 2:0
Module parse failed: Unexpected character '#' (2:0)
You may need an appropriate loader to handle this file type.
| 
> ### Keyboard Shortcuts
| 
| - `/`: Show directory listing
 @ ./client/routes.js 11:0-56 44:26-43
 @ ./client/App.js
 @ ./client/index.js
 @ multi webpack-hot-middleware/client ./client/index.js
[mdx-go] listening on http://localhost:8080
^C

Any idea why it's breaking due to a file that isn't even present in the directory? Is there something wrong on my end that I need to change? Please do let me know.

Custom Babel config

I'm trying to use styled-jsx along with mdx-go, but I'm breaking the code trying to modify the babel plugins: https://github.com/zeit/styled-jsx#getting-started.

build --static still adds prefetch links to head

Im running mdx-go build pages --static but the output html files still get

    <link rel='prefetch' as='script' href='/main.js'><link rel='prefetch' as='script' href='/1.main.js'><link rel='prefetch' as='script' href='/2.main.js'><link rel='prefetch' as='script' href='/3.main.js'><link rel='prefetch' as='script' href='/4.main.js'>

appended to the head tag. Is there a way to prevent this when building static? I'm trying to use mdx-go to create HTML emails and this tag is useless to that.

Also static still builds {number}.main.js files though I just need the HTML and zero JS files.

Separate components list package

Typescript support?

I tried to import a tsx/ts component, it didn't work, and couldn't figure out how to make it work. Do you think this should be supported by default?

Copy images to build folder

Hey,

I used mdx-go to spin up my personal site, using my repo's README as the content. The same as you did for yours!

I love the simplicity and how easy it is to maintain. Thanks for that!

I was wondering, is there a way to copy images from src to dist?

I imagine if instead of using mdx-go I used mdx with the webpack loader I could do this, but I love how tooling-less mdx-go is.

Thanks! 👊

Themes

Exporting custom path in md component does not work

Hi, First of all, thank you for your awesome work on all the libs!

I noticed the export const path = '...' doesn't seem to work for me. I checked the code and by the looks of it, you only add custom exports when it's the Index component. And the exports are loaded in promise, so the path would not get there anyway I guess.

https://github.com/jxnblk/mdx-go/blob/master/lib/client/routes.js#L58

I am trying to achieve custom and nested links with custom menu, so that's why I needed this. I really like mdx-go and was avoiding using Gatsby, because this was more than sufficient for my needs.

Compile to MD

Thanks for this amazing library! I have one question though: Can I export to .md files instead of html + js + css?

Ensure error overlay works

TOC links lead to .md domain instead of a sibling file

I have a doc directory, with:

blank index.mdx
some docs in build.md

mdx-go renders the default page as:

Project Documentation
TOC

<li href="//build.md"> build

I imagine that ./build.md or simply build.md was intended in the link target 🤔

Edit: actually, ./build or build is intended, because that renders markdown, while build.md shows raw file...

Deployment disabled on Now

export 'DocsLayout' was not found in 'mdx-go'

The documentation pages mention DocsLayout, yet when trying to import it, I'm being confronted with the error "export 'DocsLayout' was not found in 'mdx-go', and this repo doesn't seem to have any component defined with that name.

Upgrade to latest `mdx` version

mdx is now at v16, and fixes some nice little bugs 🎉

I've created a PR for it:
#24

👊

ReferenceError: window is not defined when building

Hi Brent,

Great piece of work. Upon building I get the error ReferenceError: window is not defined when using the window object. It's not obvious what might cause this, I guess it's related to the server side render when building.

Static flag does not remove code split bundles

Pagination cause `staticContext` react DOM warning

Not sure why, after add a new page, dev console have this error message

react-dom.development.js:492 Warning: React does not recognize the `staticContext` prop on a DOM element. If you intentionally want it to appear in the DOM as a custom attribute, spell it as lowercase `staticcontext` instead. If you accidentally passed it from a parent component, remove it from the DOM element.
    in a (created by Link)
    in Link (created by Route)
    in Route (created by NavLink)
    in NavLink
    in Unknown (created by Styled(Component))
    in Styled(Component)
    in div (created by Styled(div))
    in Styled(div)
    in Unknown (created by Route)
    in Route (created by withRouter())
    in withRouter() (created by Root)
    in div (created by Styled(div))
    in Styled(div) (created by Main)
    in div (created by Styled(div))
    in Styled(div) (created by Main)
    in Main (created by Root)
    in div (created by Styled(div))
    in Styled(div) (created by Layout)
    in Layout (created by Root)
    in Root (created by Route)
    in Route (created by withRouter(Root))
    in withRouter(Root) (created by App)
    in MDXProvider (created by App)
    in HeadProvider (created by App)
    in App
    in Router (created by BrowserRouter)
    in BrowserRouter

After removing Pagination from my layout, the error message has gone.

I believe that Pagination component should do the same thing as NavLinks to pull staticContext props, like

Pagination = withRouter(({
  routes = [],
  order = [],
  filter,
  history,
  location,
  match,
  staticContext
  ...props
})

Custom File Match

Attempting to use a custom file matching pattern to only process .mdx files and ignore .js but not having any luck.

I've added:
export const files = require.context('.', true, /\.mdx$/, 'lazy')

To the root level index.mdx file but it is still attempting to process .js files.

What might I be doing incorrectly?

Thanks for your help.

jxnblk / mdx-go Goto Github PK

mdx-go's People

Contributors

Stargazers

Watchers

Forkers

mdx-go's Issues

File Structure:

image markdown:

Recommend Projects

Recommend Topics

Recommend Org