笔记应用点击编辑按钮报错：marked is not a function 求助

错误原因 #

你使用的marked 4.2.12版本调整了全局API：原本直接调用marked(markdownText)的方式被移除，现在marked是一个包含解析方法的对象，直接调用它会触发类型错误。

修复步骤 #

1. 修正Markdown解析逻辑 #

将JavaScript代码中解析Markdown的行：

main.innerHTML = marked(value);

替换为：

main.innerHTML = marked.parse(value);

2. 修复CSS布局问题（建议补充） #

你的CSS中.notes的宽高属性缺少单位，浏览器无法正确解析，补充px单位：

.notes {
    background-color: #fff;
    width: 400px;
    height: 400px;
    margin: 20px;
}

修复后的完整JavaScript代码 #

const notesEl = document.querySelector('.notes');
const editBtn = document.querySelector('.edit');
const deleteBtn = document.querySelector('.delete');

const main = notesEl.querySelector('.main');
const textArea = notesEl.querySelector('textarea');

editBtn.addEventListener('click', () => {
    main.classList.toggle('hidden');
    textArea.classList.toggle('hidden');
});

textArea.addEventListener("input", (e) => {
    const { value } = e.target;

    main.innerHTML = marked.parse(value);
});

修改完成后，点击编辑按钮切换视图时，输入的Markdown内容就能正常渲染到.main容器中了。

内容的提问来源于stack exchange，提问作者aldo ls