fix(gatsby-plugin-mdx): fix html field resolver to work with webpack@5

[pieh]

Description

html field in gatsby-plugin-mdx was not working due its usage of webpack and not migrating it to work with webpack@5:

• webpack's compilation object now release actual source from memory after emitting so asset.source() was just not working anymore, because it was already SizeOnlySource that we can only grab size stats from (ref https://webpack.js.org/blog/2020-10-10-webpack-5-release/#sizeonlysource-after-emit )
• lack of node externals preset resulted in various module like stream or util not being available

This changes how it currently work to straight import produced file (similar as we do in core for ssr rendering) and skip messing with compilation object to grab source and then materialize/evaluate it (and using additional webpack plugin just for that)

Related Issues

Fixes #29983

[laurieontech]

Can we add an e2e test that uses the html field so we can make sure this doesn't break again?

[pieh]

Can we add an e2e test that uses the html field so we can make sure this doesn't break again?

None of our e2e tests use mdx so I would need to do full setup or add it to e2e/production-runtime one, but will do

[laurieontech]

@pieh we have two that do. mdx and mdx-less-babel

[laurieontech]

Thanks for adding that!

[vladar]

Published in gatsby-plugin-mdx@2.0.1