|
| 1 | +export const info = { |
| 2 | + author: [ |
| 3 | + {github: 'wooorm', name: 'Titus Wormer', twitter: 'wooorm'} |
| 4 | + ], |
| 5 | + modified: new Date('2023-10-24'), |
| 6 | + published: new Date('2023-10-24') |
| 7 | +} |
| 8 | +export const navExclude = true |
| 9 | + |
| 10 | +# Migrating from v2 to v3 |
| 11 | + |
| 12 | +A couple small changes this time around. |
| 13 | +For most folks, updating Node.js and plugins is all that’s needed! |
| 14 | + |
| 15 | +## Contents |
| 16 | + |
| 17 | +* [Update Node.js](#update-nodejs) |
| 18 | +* [Update plugins](#update-plugins) |
| 19 | +* [Pass `baseUrl` to `evaluate`, `run`](#pass-baseurl-to-evaluate-run) |
| 20 | +* [Use the automatic JSX runtime](#use-the-automatic-jsx-runtime) |
| 21 | +* [Replace `MDXContext`, `withMDXComponents` with `useMDXComponents`](#replace-mdxcontext-withmdxcomponents-with-usemdxcomponents) |
| 22 | +* [Replace `@mdx-js/register` with `@mdx-js/node-loader`](#replace-mdx-jsregister-with-mdx-jsnode-loader) |
| 23 | + |
| 24 | +## Update Node.js |
| 25 | + |
| 26 | +If you’re still on old Node, it’s time to update. |
| 27 | +Use at least Node 16. |
| 28 | + |
| 29 | +## Update plugins |
| 30 | + |
| 31 | +If you use rehype and remark plugins: update. |
| 32 | + |
| 33 | +Most of them remain working between versions. |
| 34 | +Particularly if you use TypeScript, there was a breaking internal change in the |
| 35 | +types, which is now supported here. |
| 36 | +There were also some small internal changes in how the parser works, which |
| 37 | +affect `remark-gfm` and `remark-math`. |
| 38 | + |
| 39 | +## Pass `baseUrl` to `evaluate`, `run` |
| 40 | + |
| 41 | +If you use `evaluate` or `run` (or `outputFormat: 'function-body'`), you should |
| 42 | +pass the `baseUrl` option. |
| 43 | +Likely set to `import.meta.url`. |
| 44 | + |
| 45 | +If MDX content uses `export` statements, `import` expressions/statements, |
| 46 | +or `import.meta.url`, we compile to code that works, but it needs to know |
| 47 | +where the code runs: you need to pass where you are. |
| 48 | + |
| 49 | +You will get a runtime error if these features are used in MDX without |
| 50 | +`baseUrl`. |
| 51 | + |
| 52 | +If you passed the `useDynamicImport` option before, remove it, the behavior |
| 53 | +is now the default. |
| 54 | + |
| 55 | +## Use the automatic JSX runtime |
| 56 | + |
| 57 | +If you use the classic runtime, switch to the automatic runtime. |
| 58 | +Classic is still supported but you will now see a warning if you use the |
| 59 | +classic JSX runtime. |
| 60 | + |
| 61 | +The classic runtime can still be nice in other places, but it causes potential |
| 62 | +problems in MDX. |
| 63 | +If you specify `jsxRuntime: 'classic'` (and `pragma`, `pragmaFrag`, |
| 64 | +`pragmaImportSource`), consider switching to `automatic`. |
| 65 | +All major frameworks support the automatic runtime. |
| 66 | +Support for the classic runtime will likely be removed next major. |
| 67 | + |
| 68 | +## Replace `MDXContext`, `withMDXComponents` with `useMDXComponents` |
| 69 | + |
| 70 | +If you use the deprecated symbols `MDXContext` and `withMDXComponents`, use |
| 71 | +`useMDXComponents` instead. |
| 72 | + |
| 73 | +Reminder: you probably don’t need the context based `@mdx-js/react` or |
| 74 | +`@mdx-js/preact` packages. |
| 75 | + |
| 76 | +## Replace `@mdx-js/register` with `@mdx-js/node-loader` |
| 77 | + |
| 78 | +If you use the deprecated package `@mdx-js/register`, use `@mdx-js/node-loader` instead. |
0 commit comments