ckeditor mention not installing properly and not working

Question

I am working with CKeditor5 and ckeditor mention in react https://ckeditor.com/docs/ckeditor5/latest/features/mentions.html#demo

but this package doesnt seem to install properly and gives error like this

"Uncaught CKEditorError: ckeditor-duplicated-modules"

when I try install separately like this npm install --save @ckeditor/ckeditor5-react @ckeditor/ckeditor5-build-classic and then npm i @ckeditor/ckeditor5-mention and if I install like this npm install --save @ckeditor/ckeditor5-react @ckeditor/ckeditor5-build-classic @ckeditor/ckeditor5-mention it gives me ckeditor error when installing packages

my code `

 import { CKEditor } from '@ckeditor/ckeditor5-react'
 import { Mention } from '@ckeditor/ckeditor5-mention'
 import ClassicEditor from '@ckeditor/ckeditor5-build-classic'

 const CreatePage = () => {
 return (
 <div>
   <h2>CKEditor with Mentions</h2>
   <CKEditor
     editor={ClassicEditor}
      config={{
       plugins: [Mention],
      toolbar: ['mention', 'bold', 'italic', 'link'],
      mention: {
        feeds: [
          {
            marker: '@',
            feed: ['Alice', 'Bob', 'Charlie'], // Replace with your mentionable data
          },
        ],
      },
    }}
  />
 </div>
 )
}

export default CreatePage`

I have tried installing all modules separately and all modules together but ckeditor doesn't render and work properly with @ckeditor/ckeditor5-mention