Next.js & MDX errors All In One
<h1 id="nextjs--mdx-errors-all-in-one">Next.js & MDX errors All In One</h1><pre><code class="language-md">
Server Error
Error: Expected component TestComponent to be defined: you likely forgot to import, pass, or provide it.
It’s referenced in your code at 17:1-17:17 in /Users/xgqfrms-mm/Documents/github/ssr-next/src/next-ts-ssr-app/pages/md/test.mdx
This error happened while generating the page. Any console logs will be displayed in the terminal window.
</code></pre>
<h2 id="error-handling">Error Handling</h2>
<p>https://nextjs.org/docs/advanced-features/error-handling</p>
<p>https://nextjs.org/docs/advanced-features/custom-error-page#customizing-the-500-page</p>
<pre><code class="language-js">
// pages/500.js
export default function Custom500() {
return <h1>500 - Server-side error occurred</h1>
}
</code></pre>
<pre><code class="language-js">// pages/404.js
export default function Custom404() {
return <h1>404 - Page Not Found</h1>
}
</code></pre>
<h2 id="mdx">MDX</h2>
<p>https://nextjs.org/docs/advanced-features/using-mdx</p>
<p>https://www.mdxjs.cn/getting-started/next</p>
<p>https://nextjs.org/docs/advanced-features/dynamic-import</p>
<h2 id="demos">demos</h2>
<blockquote>
<p><code>mdx</code> & next.js & <code>prism</code></p>
</blockquote>
<p>next-ts-ssr-app/pages/md/test.mdx</p>
<p>https://github.com/xgqfrms/ssr-next/</p>
<pre><code class="language-js">
// import '../styles/themes/dracula-prism.css'
import '../styles/themes/prism-vsc-dark-plus.css'
// import '../styles/themes/prism-one-dark.css'
</code></pre>
<p>/Users/xgqfrms-mbp/Documents/GitHub/ssr-next/src/next-ts-ssr-app/pages/_app.tsx</p>
<p>https://github.com/xgqfrms/ssr-next/issues/4</p>
<p>https://github.com/xgqfrms/ssr-next/blob/master/src/next-ts-ssr-app/pages/mdx/index.mdx</p>
<p><img src="https://img2023.cnblogs.com/blog/740516/202212/740516-20221203180917570-579502625.png" alt="image" loading="lazy"></p>
<h2 id="refs">refs</h2>
<p>https://blog.logrocket.com/create-next-js-mdx-blog/</p>
<p>https://www.joshwcomeau.com/blog/how-i-built-my-blog/</p>
<p>https://magrippis.com/blog/2020/how-to-setup-MDX-in-Nextjs</p>
<hr>
<div>
</div>
<hr>
<blockquote style="display: flex; flex-flow: column; align-items: center; justify-content: center; text-align: center; border: none">
<h3><strong><span style="font-size: 16pt; color: rgba(0, 255, 0, 1)">©xgqfrms 2012-<span data-uid="copyright-aside">2021</span></span></strong>
<p><span style="font-size: 18pt; color: rgba(0, 255, 0, 1)"><strong>www.cnblogs.com/xgqfrms 发布文章使用：只允许注册用户才可以访问！</strong></span></p>
<p><span style="font-size: 18pt; color: rgba(0, 255, 0, 1)"><strong>原创文章，版权所有©️xgqfrms, 禁止转载 🈲️，侵权必究⚠️！</strong></span></p>
</h3></blockquote>
<hr>
</div>
<div id="MySignature" role="contentinfo">
<div style="display: flex; flex-flow: column nowrap; align-items: center; justify-content: center;">
<p>本文首发于博客园，作者：xgqfrms，原文链接：https://www.cnblogs.com/xgqfrms/p/16863604.html</p>
<p style="color: red; font-size: 23px; margin-top: 5px; margin-botom: 5px;">未经授权禁止转载，违者必究！</P>
</div>
<hr/><br><br>
来源：https://www.cnblogs.com/xgqfrms/p/16863604.html
頁:
[1]