vscode-mdx-preview icon indicating copy to clipboard operation
vscode-mdx-preview copied to clipboard

Support for Next.JS projects

Open GorvGoyl opened this issue 5 years ago • 4 comments

Currently it doesn't work for Next.js project.

This is the error I get when previewing mdx file:

Unhandled Rejection (Error): React is not defined
w
lib/errors.ts:43:8
  40 |  */
  41 | const handleRuntimeError = (error: Error) => {
  42 |   hasRuntimeError = true;
> 43 |   throw new Error(error.message);
     |        ^  44 | };
  45 | 
  46 | export {
View compiled
(anonymous function)
evaluate.ts:134:4
  131 |   ExtensionHandle.reportPerformance(evaluationEndTime - evaluationStartTime);
  132 |   return evaluatedModule;
  133 | } catch(error) {
> 134 |   handleRuntimeError(error);
      |  ^  135 | } finally {
  136 |   evaluationProgress.value = EvaluationProgress.COMPLETED;
  137 | }
View compiled
▶ 5 stack frames were collapsed.
This screen is visible only in development. It will not appear if the app crashes in production.
Open your browser’s developer console to further inspect this error.

GorvGoyl avatar Dec 11 '20 19:12 GorvGoyl

Any news about this ?

pedroresende avatar Feb 05 '22 10:02 pedroresende

Next.js auto imported React in components. Seems like you should manually import React again in the component which is used in MDX.

import React from "react"

42arch avatar May 27 '22 04:05 42arch

Hello .... I think I am experience this issue. Attempting to Preview .mdx files in a Next.js project in vsCode

sheehyjohn avatar Jul 23 '23 12:07 sheehyjohn

Hello .... I think I am experience this issue. Attempting to Preview .mdx files in a Next.js project in vsCode

In files.associations you mention the languageId to use for a particular file extension

"files.associations": { "*.mdx": "markdown" },

danadalis avatar Oct 18 '23 17:10 danadalis