docusaurus v2 admonitions

[prasathsekar]

I have tried to use react-admonitions in docusaurus v2.

I have done

npm install --save react-admonitions

Then used the below code in my markdown file it showing error

Code:

import React, { Component } from 'react'

import Admonition from 'react-admonitions'

class Example extends Component {
  render() {
    return (
      <Admonition type="warning" title="Do not do this">
        Admonition Content
      </Admonition>
    )
  }
}

This is what i have done.

[nebrelbug]

Would you mind posting what the error message says? Also, try renaming your .md file to .mdx

P.S. I edited your issue to improve reading

[prasathsekar]

This the following error

SyntaxError: /home/prasath/Desktop/prasath_doc/docs/test.mdx: Identifier 'React' has already been declared (11:7)

9 | }; 10 | / @jsx mdx /

11 | import React, { Component } from 'react' | ^ 12 | import Admonition from 'react-admonitions' 13 | export const rightToc = [{ 14 | value: 'Install and use', @ ./.docusaurus/registry.js 702:15-58 697:13-699:29 @ ./node_modules/@docusaurus/core/lib/client/exports/ComponentCreator.js @ ./.docusaurus/routes.js @ ./node_modules/@docusaurus/core/lib/client/clientEntry.js @ multi (webpack)-dev-server/client?http://localhost (webpack)/hot/dev-server.js ./node_modules/@docusaurus/core/lib/client/clientEntry.js

[nebrelbug]

Hi @prasathsekar, React is actually imported by default, and I don't think MDX supports writing class-based components.

This should work:

import Admonition from 'react-admonitions'

<Admonition type="warning" title="Do not do this">
Admonition Content
</Admonition>

[prasathsekar]

Yes Done. Now it is working perfect.