Untitled

import { LightningElement } from 'lwc';
import CODEMIRROR from '@salesforce/resourceUrl/CodeMirror';
import { loadStyle, loadScript } from "lightning/platformResourceLoader";
export default class CodingComponent extends LightningElement {

    scriptsLoaded = false;
    
    codeMirrorInitialized = false; 
    connectedCallback() {
        this.loadCodeMirrorResources(); 
    }

   
    loadCodeMirrorResources() {
        if (this.codeMirrorInitialized) {
            return; 
        }

    
        Promise.all([
            loadScript(this,  CODEMIRROR + "/lib/codemirror.js"),
            loadStyle(this, CODEMIRROR + "/lib/codemirror.css")
        ])
        .then(() => {
            this.codeMirrorInitialized = true; 
            this.initializeCodeMirror(); 
        })
        .catch(error => {
            console.error('Error loading CodeMirror resources:', error);
        });
    }

 
    initializeCodeMirror() {
       
        const editorElement = this.template.querySelector('.code-editor');
        this.editor = CodeMirror.fromTextArea(editorElement, {
            lineNumbers: true,
            mode: 'javascript', 
            theme: 'default', 
        });
    }
}