Hacktoberfest 2026: le issue che i maintainer hanno segnato per ottobre, aperte e adatte ai principianti. Sfoglia le issue Hacktoberfest

Module not found: Can't resolve '#minpath' during compilation

Aperta
  • Qualcosa non va?
#183 1 commento 2 reazioni 0 assegnatari Vedi su GitHub

Nessuno ha ancora preso questa issue.

Valutazione

Difficoltà
3/5
Tempo stimato
1-2 giorni
Idoneità per principianti
30/100
Tipo di issue
Bug
Chiarezza
Abbastanza chiara
Stato di attività
Ferma
Stack tecnologico
react, typescript
Ambito
build-system, frontend

Direzione di ricerca

Reproduce the CRA-based TypeScript setup with @uiw/react-textarea-code-editor and inspect the dependency path leading to vfile/lib and the unresolved #minpath import. Compare the installed package versions and build configuration, then verify that npm start compiles the example without the module-resolution error.

Scritto dal modello di indicizzazione a partire dal testo della issue.

Descrizione

I'm using @uiw/react-textarea-code-editor in a React project to create a basic HTML code editor. The editor works fine in the component logic, but upon compiling the app, I receive the following error:

Image

📁 Environment

Project type: React (TypeScript)
Code Editor: @uiw/react-textarea-code-editor
Build tool: React Scripts (CRA-based)
OS: Windows 11
Node: v20.18.0
NPM: v10.8.2

🧪 Steps to Reproduce

Install @uiw/react-textarea-code-editor

Use it in a component like this:

<CodeEditor
  value={code}
  language="html"
  placeholder="Please enter HTML code"
  onChange={(evn) => setCode(evn.target.value)}
/>

Run npm start

Compilation fails cannot resolve #minpath error from vfile\lib

✅ What I've Tried
npm update vfile
npm install #minpath
Code Snippet
import React, { useEffect, useState } from "react";
import CodeEditor from '@uiw/react-textarea-code-editor';

interface IHtmlCodeEditorProps {
    htmlValue: string;
    setHtmlValue: (value: string) => void;
    readOnly?: boolean;
    show?: boolean;
}

export const HtmlCodeEditor = (props: IHtmlCodeEditorProps) => {
    const [code, setCode] = useState(props.htmlValue);

    const handleCodeChange = (newCode: string) => {
        setCode(newCode);
        props.setHtmlValue(newCode);
    };

    return (
        <div style={{ display: 'flex', flexDirection: 'column', gap: '10px', width: '100%' }}>
            {props.show && (
                <>

                    <CodeEditor
                        value={code}
                        language="html"
                        placeholder="Please enter HTML code."
                        onChange={(evn) => handleCodeChange(evn.target.value)}
                        padding={15}
                        style={{
                            backgroundColor: "#f5f5f5",
                            fontFamily: 'ui-monospace,SFMono-Regular,SF Mono,Consolas,Liberation Mono,Menlo,monospace',
                        }}
                    />
                    <pre style={{ overflowY: "auto", whiteSpace: 'pre-wrap', wordWrap: 'break-word', overflow: 'auto' }}>
                        {code}
                    </pre>

                </>
            )}
        </div>
    );
};
Lingua principale
TypeScript
Stelle
576
Fork
23
Nessuna PR unita negli ultimi 30g

Preparare l'ambiente

Questo progetto non fornisce container di sviluppo, Dockerfile né guida per i contributori, quindi l'ambiente è a tuo carico: parti dal suo README e consulta la nostra guida al primo contributo per i passaggi generali.

Come iniziare

  1. Leggi tutta la issue e poi la guida ai contributi del progetto.
  2. Commenta sulla issue per dire che te ne occupi tu — evita che due persone facciano lo stesso lavoro.
  3. Fai un fork del repository e lavora su un branch.
  4. Apri una pull request che faccia riferimento al numero della issue.

Altre issue di uiwjs/react-textarea-code-editor

Tutte le issue di uiwjs/react-textarea-code-editor

Issue simili

Altre issue su TypeScript

Ricevi le nuove issue nella tua casella

Un breve riepilogo di issue GitHub adatte ai principianti.