Module Not Found Error

1

Hi all,

When I try typing the following, an error comes up:

import ‘codemirror/lib/codemirror.css’

import ‘codemirror/theme/material.css’

import ‘codemirror/mode/xml/xml’

import ‘codemirror/mode/javascript/javascript’

import ‘codemirror/mode/css/css’

This is what the error says:

ERROR in ./src/components/Editor.js 6:0-39

Module not found: Error: Package path ./lib/codemirror.css is not exported from package /Users/user/code-editor/node_modules/codemirror (see exports field in /Users/user/code-editor/node_modules/codemirror/package.json)

ERROR in ./src/components/Editor.js 7:0-39

Module not found: Error: Package path ./theme/material.css is not exported from package /Users/user/code-editor/node_modules/codemirror (see exports field in /Users/user/code-editor/node_modules/codemirror/package.json)

ERROR in ./src/components/Editor.js 8:0-33

Module not found: Error: Package path ./mode/xml/xml is not exported from package /Users/user/code-editor/node_modules/codemirror (see exports field in /Users/user/code-editor/node_modules/codemirror/package.json)

ERROR in ./src/components/Editor.js 9:0-47

Module not found: Error: Package path ./mode/javascript/javascript is not exported from package /Users/user/code-editor/node_modules/codemirror (see exports field in /Users/user/code-editor/node_modules/codemirror/package.json)

ERROR in ./src/components/Editor.js 10:0-33

Module not found: Error: Package path ./mode/css/css is not exported from package /Users/user/code-editor/node_modules/codemirror (see exports field in /Users/user/code-editor/node_modules/codemirror/package.json)

Can someone help?

1 Like
2

This sounds like the package you’re using has an exports field in its package.json. But the one distributed with CodeMirror 5 does not, so that’s odd. How did you install the codemirror directory?

1 Like
3

I just did the following:

First, I tried:
npm i codemirror react-codemirror2

Then, I tried:
npm i codemirror react-codemirror2-react-17

Neither worked.

1 Like
4

I also have the same issue and have explored so many options but nothing works for me, if any one here who can solve this problem please help

1 Like
5

same is here… please @marijn help to get rid out of this

1 Like
6

If you are trying to install CodeMirror version 5, you should use the command

npm i codemirror@version5

because react-codemirror-2 only supports "codemirror": "5.x".

Also you can try @codemirror-toolkit/react, which supports version 6 and React above v16.8.0.

2 Likes
7

still not working bro

1 Like
8

it helped for me thanks

1 Like
9

it will work . THANKS!!!

1 Like
10

FIrstly, run - npm config set legacy-peer-deps true
then try to run - npm i codemirror@version5
Then it will surely work!

12

yes your tip worked . so now what would be the correct way to import the features from that codemirror file which is present inside node modules …
the below was used when we had to import from codemirror 2 :-
import {Controlled as ControlledEditor } from ‘react-codemirror2’

but now since we have installed version 5 , how should we do it

13

import statement will be same as done previously because we have just changed the version it will not affect the importing

1 Like
14

ok. Thanks a lot.

15

Hey Bro! still not working.
[plugin:vite:import-analysis] Missing “./lib/codemirror.css” specifier in “codemirror” package
Showing this error could you help me

16

codemirror only works version 5

17

This is not a useful question or issue report… you don’t describe what you are doing, making it impossible for anyone to give useful feedback.

18

Hi there,
I tried using npm i react-codemirror2 --force which is indeed a workaround.

It worked for me!

19

Hello Aditya, is there any real solution for nuxt 3, I have worked with codemirror’s older versions in the past with nuxt version 2, also been able to work with codemirror@v6 on vue 3, but when I try to run it on nuxt 3, i get the same error around “Pre-transform error: Missing “./lib/codemirror.css” specifier in “codemirror” package”

Version 5 and version 6, don’t seem to be working for me on Nuxt, codemirror@v6

1 Like
20

In your terminal/cmd write:
npm uninstall codemirror
and then
npm install codemirror@5

(make sure to import codemirror css in index.ts or index.js file)