0

我正在尝试在这样的 javascript 文件中运行我的 jsx：

import React from 'react'

export class HeaderNav extends React.Component {
  constructor(props) {
    super(props)
    console.log('Created Component')
  }
}

console.log('Create New Component');
<HeaderNav />

然后我有一个 mdx 文件，它像这样导入反应组件：

import '../mdx/header-nav'

这不会创建组件，只会Create New Component输出到控制台，我希望两者console.logs都能打印。

当我将组件导入到我的 MDX 文件中并放置 html 时，它就可以正常工作：

import React from 'react'

export class HeaderNav extends React.Component {
  constructor(props) {
    super(props)
    console.log('Created Component')
  }
}

然后我有一个 mdx 文件，它像这样导入反应组件：

import { HeaderNav } from '../mdx'

<HeaderNav />

Created Component这将在控制台中创建组件和输出。

我需要做些什么来使用第一种导入文件的方法，这样我就不必将元素放在我的所有 mdx 文件中了吗？

4

0 回答 0