问题描述
在配置过程中发现这篇文章所提到的问题我都遇到过（blog.csdn.net/weixin_4211…
按照文中的配置试了一遍，还是会提示报错：
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders } } else if (node.type === "ordered_list") { let index = ((_b = node.payload) == null ? void 0 : _b.startIndex) ?? 1; node.children.forEach((item) => { if (item.type === "list_item") {
解决办法
版本兼容问题，试下markmap版本降到markmap-common@0.14.2 markmap-lib@0.14.4 markmap-view@0.14.0
如果还有问题，可以尝试更改其他版本，版本地址如下
代码展示
<template>
<svg id="markmap" style="width: 100%;height: 800px;border:1px solid red" />
</template>
<script>
import { Transformer } from 'markmap-lib'
import { Markmap } from 'markmap-view'
export default {
name: 'Markmap',
data() {
return {
content: `
# My Mind Map
## **初步处理**
### **清水冲洗**
- 使用大量清水冲洗，以稀释毒液，减少皮肤损伤
### **碱性溶液冲洗**
- 使用碱性溶液如肥皂水、小苏打水等冲洗，以中和毒液
## **药物治疗**
### **消炎药膏**
- 使用炉甘石洗剂、地奈德霜及丁酸氢化可的松霜等消炎药膏
- 使用百多邦等消炎药膏进行治疗
### **抗过敏药物**
- 口服抗组胺药物如氯雷他定、西替利嗪等
- 对于症状较重的患者，可以口服小剂量的糖皮质激素如泼尼松内服
## **抗感染治疗**
- 使用氧氟沙星胶囊、阿莫西林胶囊等药物进行抗感染治疗
- 局部出现明显疼痛、红肿等不适症状，建议患者及时就医，在医生指导下使用碳酸氢钠溶液进行冲洗，还可以遵医嘱外用醋酸地塞米松乳膏、复方氟米松软膏等药物进行治疗`
}
},
mounted() {
this.renderMarkmap()
},
methods: {
handleNodeClick(node) {
console.log(node, 'node')
},
renderMarkmap() {
const transformer = new Transformer()
const { root } = transformer.transform(this.content)
// console.log(Markmap, 'MarkmapMarkmapMarkmap')
this.$nextTick(() => {
const markmap = Markmap.create(
'#markmap',
{
title: 'My Mind Map',
zoom: 1.5
},
root
)
console.log(markmap, 'markmapmarkmapmarkmap')
// markmap.handleClick()
})
}
}
}
</script>
