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.

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

Update webpack.config.js #12167

Open
wants to merge 2 commits into
base: main
Choose a base branch
from

Conversation

zingbretsen
Copy link

@zingbretsen zingbretsen commented Mar 14, 2022

Adds mdx to file loader exclude section

Addresses this issue: #12166

Just edits one line in the webpack config from react-scripts as suggested here:
mdx-js/mdx#1870 (comment)

I made the edit in my local version of webpack.config.js in react-scripts which is installed in my project, and that is sufficient to get mdx to work with no errors.
Screen Shot 2022-03-14 at 12 04 13 PM

I don't know what other ramifications this might have. I'm not a JS dev, but this solution worked for my problem.

Adds mdx to file loaded exclude section
@facebook-github-bot
Copy link

Hi @zingbretsen!

Thank you for your pull request and welcome to our community.

Action Required

In order to merge any pull request (code, docs, etc.), we require contributors to sign our Contributor License Agreement, and we don't seem to have one on file for you.

Process

In order for us to review and merge your suggested changes, please sign at https://code.facebook.com/cla. If you are contributing on behalf of someone else (eg your employer), the individual CLA may not be sufficient and your employer may need to sign the corporate CLA.

Once the CLA is signed, our tooling will perform checks and validations. Afterwards, the pull request will be tagged with CLA signed. The tagging process may take up to 1 hour after signing. Please give it that time before contacting us about it.

If you have received this in error or have any questions, please contact us at cla@fb.com. Thanks!

@facebook-github-bot
Copy link

Thank you for signing our Contributor License Agreement. We can now accept your code for this (and any) Meta Open Source project. Thanks!

@thediveo
Copy link

thediveo commented Apr 7, 2022

I'm blocked in my upgrade to CRA 5.0.0 by 5.0.0 making @mdx-js/loader to not work anymore and there are lots of CVEs on CRA 4.x dependencies, so can the CRA devs this please move forward?

@thediveo
Copy link

thediveo commented Apr 7, 2022

Might the file extension list also need to include md too?

@userzimmermann
Copy link

Also a loader definition for test: /\.(md|mdx)$/ —as proposed in mdx-js/mdx#1870 (reply in thread) —would be a nice addition to this PR

@userzimmermann
Copy link

userzimmermann commented Apr 8, 2022

Btw, @thediveo: If adding https://github.com/gsoft-inc/craco to your project(s) is acceptable for you, then you could use mdx-js/mdx#1870 (comment) as a (temporary) workaround …

@thediveo
Copy link

thediveo commented Apr 8, 2022

Btw, @thediveo: If adding https://github.com/gsoft-inc/craco to your project(s) is acceptable for you, then you could use mdx-js/mdx#1870 (comment) as a (temporary) workaround …

CRACO unfortunately claims only CRA 4.x support. Do you have experience with it on CRA 5.0? So far, I wanted to avoid bringing in even more configuration-related mechanisms into what appears to be already a highly brittle construction.

@userzimmermann
Copy link

Do you have experience with it on CRA 5.0?

Some parts of the CRACO API are not fully compatible w/CRA 5 yet; but so far all runner scripts work—as well as those features needed for the workaround …

@zingbretsen
Copy link
Author

userzimmermann

In addition to or instead of the current change?

@userzimmermann
Copy link

userzimmermann commented Apr 8, 2022

In addition to or instead of the current change?

Hmm … actually instead, @zingbretsen

When extending the exclude list, you still have to define the MDX loader externally; or have to use import ... from '!@mdx-js/loader!...' syntax …

And when defining the loader—internally or externally—I've figured meanwhile out that you don't need to extend the exclude list anymore … but it also wouldn't hurt ;)

So I think now it'd be best to just extend the exclude list w/md|mdx—therefore ignoring #12167 (comment) —and leave it up to the app developer how to configure their @mdx-js/loader integration …

@userzimmermann
Copy link

userzimmermann commented Apr 8, 2022

On the other hand :D —according to https://mdxjs.com/docs/getting-started/#create-react-app-cra —MDX support seems to have come out of the box w/CRA < 5 … Whereby I don't know it you still needed the import ... from '!@mdx-js/loader!...' syntax … Tricky topic ;)

What's your opinion on all of this, @iansu & @mrmckeb?

[Update] I should've read https://mdxjs.com/docs/getting-started/#create-react-app-cra more carefully …

@zingbretsen
Copy link
Author

I added md to the excludes list in addition to mdx.

I'll defer to actual JS devs if you want any other changes as part of the PR.

@userzimmermann
Copy link

[Update] I should've read https://mdxjs.com/docs/getting-started/#create-react-app-cra more carefully …

But anyway—I'm still curious: Did you really need to use the webpack !@mdx-js/loader! import syntax in your project(s), @thediveo?

@thediveo
Copy link

thediveo commented Apr 8, 2022

But anyway—I'm still curious: Did you really need to use the webpack !@mdx-js/loader! import syntax in your project(s), @thediveo?

I think so, here's an example of it: integrated help in lxkns service web UI. Please note that I'm using the "all-batteries-included" mdx-loader which wraps @mdx-js/loader and configures MDX plugins.

@Duell10111
Copy link

Bump @iansu @mrmckeb

@maximilianro
Copy link

Hello @iansu @mrmckeb , is there anything left to do on this PR? Merging this would resolve a huge blocker

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

6 participants