createElement is not a function 编写代码高亮功能遇到的问题

最新推荐文章于 2024-09-04 16:54:49 发布
最新推荐文章于 2024-09-04 16:54:49 发布
阅读量4.6k 收藏 1
点赞数
分类专栏： bpmn 文章标签： vue.js html javascript
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_40820382/article/details/120702775
版权
在Vue3项目中遇到`createElement is not a function`错误，原因是使用的`highlight.js`版本不兼容。为了解决这个问题，将`highlight.js`替换为`vue3-highlightjs`版本1.0.5。引入并使用后，成功实现了XML和JSON的高亮显示。参考链接提供了详细步骤和解决方案。
摘要由CSDN通过智能技术生成

问题：
createElement is not a function

参考资源： https://www.npmjs.com/package/vue3-highlightjs?activeTab=dependencies
在这里插入图片描述
在这里插入图片描述
参考博客
https://stackoverflow.com/questions/64114215/using-vue-chartjs-in-vue-3-createelement-is-not-a-function
在这里插入图片描述

https://v3.vuejs.org/guide/migration/render-function-api.html#_2-x-syntax-2

createElement is not a function

解决
我是要显示xml 和json，因为项目需求是 展示生产的 bpmn的xml或json，网上都是vue2.x编码的，我的项目是vue3.x，所以不能直接照搬，直接复制的

 <highlightjs :language="previewType" :code="previewResult" />

不能正常使用，原来的是 “highlight.js”: “^10.7.3”, 这个依赖，所以换为下面的依赖
“vue3-highlightjs”: “^1.0.5”, 即可
参考：
https://www.npmjs.com/package/vue3-highlightjs?activeTab=dependencies
点击 readme
在这里插入图片描述
引入
在这里插入图片描述
使用效果
在这里插入图片描述
在这里插入图片描述

展示xml和json
在这里插入图片描述
在这里插入图片描述

海马区
关注
专栏目录
2023年前端面试汇总-React
越陌度阡
06-29 865
React并不是将click事件绑定到了div的真实DOM上，而是在document处监听了所有的事件，当事件发生并且冒泡到document处的时候，React将事件内容封装并交由真正的处理函数运行。这样的方式不仅仅减少了内存的消耗，还能在组件挂在销毁时统一订阅和移除事件。除此之外，冒泡到document上的事件也不是原生的浏览器事件，而是由react自己实现的合成事件（SyntheticEvent）。因此如果不想要是事件冒泡的话应该调用event.preventDefault()方法，而不是调用event
组件-Element—Notification（ 通知）
GU_AO_SHI_TAI_DU的博客
07-04 2035
组件-Element—Notification（ 通知） 组件— 通知 基本用法 <template> <el-button plain @click="open1"> 可自动关闭 </el-button> <el-button plain @click="open2"> 不会自动关...
使用viewui 报错 unaught TypeError: t.createElementVNode is not a function at viewuiplus.min.js
最新发布
m0_59157023的博客
09-04 314
原因是：由于引入 viewui 版本不兼容 我是VUE2 这个组件库是基于VUE3的。
vue2升级vue3：this.$createElement is not a function—动态组件升级
周陆军的博客，分享it技术。
06-21 3546
vue2 动态组件加载，this $createElement非常好使！return this $createElement(chartPanel, {props:{}})，但是到vue3如何操作呢？
TypeError: _reactNative.default.createElement is not a function
慕天远的博客
04-18 2304
原因 我是react native的初学者 今天做练习用到了react-native-vector-icons/Ionicons 我在应用矢量图标的时候将字符串写错导致了这个错误，例如 以后敲代码一定要细心哦。 还有一种情况也可能导致这样的错误，那就是我们在导入组件的时候除了问题 如下是我的原代码 这是网络上的一些旧版本的写法，在新版本中组件名字不需要用{}包裹了...
vue学习笔记 element-plus export ‘createElementVNode‘ (imported as ‘_createElementVNode‘) was not found
xjcwzp的专栏
08-18 7703
Vue CLI 版本是5.0.0-beta.3 创建新项目后，运行正常 安装element-plus 运行报错 export ‘createElementVNode’ (imported as ‘_createElementVNode’) was not found in ‘vue’ 浏览器中报错误 Uncaught TypeError: (0 , vue__WEBPACK_IMPORTED_MODULE_0__.createElementVNode) is not a function
【持续更新】最全Hexo个人博客搭建+主题优化+插件配置+错误分析
Simon__He的博客
11-04 6092
前言 欢迎在文末留言，或者点击加入QQ群933583982互相交流。 本文采用 CC BY-NC-SA 4.0 许可协议，转载请注明出处！ Hexo博客搭建 准备环境 Node.js 下载并安装。 Git 下载并安装。 安装Hexo，在命令行（即Git Bash）运行以下命令： npm install -g hexo-cli 初始化Hexo，在命令行（即Git Bash）依...
前端面试问题（适用于面试回答思路）
yaminne的博客
03-28 4995
原型和原型链 原型：构造函数的 prototype 属性指向了一个对象，这个对象正是调用该构造函数而创建的实例的原型。也即，每个构造函数的实例都有一个原型，叫原型对象，由实例对象的内置属性_proto_指向。每个原型都有一个 constructor 属性指向关联的构造函数。 原型用法：构造函数创建的实例可以访问实例的属性和方法，也可以访问原型的属性和方法。对于原型只能访问自己的属性和方法。考虑这一特性，如果对象公有的属性和方法，我们可以添加到原型上面，对象需要的时候直接访问原型的属性和方法就可以。 当读取实
【HTML标签扩展Markdown】：进阶布局与功能增强秘籍
![python库文件学习之markdown]...# 1.... ... ...它是网页设计的基石，涉及到从基本的文本来丰富复杂的布局和交互功能。理解HTML标签是打造高质量网页的第一步。在本章中，我们会回顾一些基础的HTML标签
Web开发中Chrome DevTools攻略（深入理解和利用开发者工具、元素面板和控制台、网络和资源面板、应用和源代码面板等等）
半夏微凉科技
05-17 750
Chrome开发者工具（DevTools）是Web开发中不可或缺的利器，它提供了一系列强大的功能，帮助开发人员调试、优化和审查网页。本文将深入探讨Chrome DevTools的各种功能和技巧，帮助你更好地利用这个工具来提升你的Web开发技能。
Uncaught TypeError: (0 , vue__WEBPACK_IMPORTED_MODULE_3__.createVNode) is not a function
潮汐未见潮落的博客
08-09 8723
vue 项目全局引入 ant- design-vue 报错：Uncaught TypeError: (0 , vue__WEBPACK_IMPORTED_MODULE_3__.createVNode) is not a function
vue学习笔记 export ‘default‘ (imported as ‘Vue‘) was not found in ‘vue‘
xjcwzp的专栏
07-14 7472
版本：vue3 vue/cli 5.0.0 做写store时报错 import Vue from "vue"; import Vuex from "vuex"; import getters from "./getters"; import user from "./modules/user"; Vue.use(Vuex); const store = new Vuex.Store({ modules: { user, }, getters, }); export defa
Uncaught TypeError: document.registerElement is not a function at Object.UI.registerCustomElement
Flora_SM的博客
09-23 1147
谷歌浏览器报错： Uncaught TypeError: document.registerElement is not a function at Object.UI.registerCustomElement (shell.js:3109) 原因：谷歌浏览器版本兼容问题， document.registerElement 特性在谷歌80版本下是支持的，但是在80版本之上不支持，所以下载谷歌低版本就能解决该问题。 ...
TypeError: document.getELementById is not a function
06-12 2250
这个错误困扰了我好几个小时，在网上也百度了好久类似的问题但都没有结果，反反复复看了好多遍，才发现，原来是document.getELementById 里面的Element的字母 l 我写成了大写的L。。。这就是错误原因，希望其他有类似错误的同胞们多加注意了哦 转载于:https://www.cnblogs.com/RitaLee/p/5578507.html...
rollup 打包vue3组件库报错 ‘createElementVNode‘ is not exported by node_modules\vue\dist\vue.runtime.esm.js
东扯葫芦西扯瓜——前端小菜鸟的博客
08-28 9457
rollup 打包vue3组件库报错 ‘createElementVNode’ is not exported by node_modules\vue\dist\vue.runtime.esm.js 报错意思就是说 createElementVNode 没有被导出。也就是找不到。然后看下面 1: import { renderSlot as _renderSlot, toDisplayString as _toDisplayString, createElementVNode as _createElem
js编程常见错误：Uncaught TypeError: XXX is not a function解决
热门推荐
先行网络技术
11-27 8万+
Uncaught TypeError: XXX is not a function解决 后台没有错误，前端一直显示Uncaught TypeError: withdraw is not a function错误，代码如下： <div class="form-group btn-right"> <button type="button" class="btn btn-primary" id="withdraw" onclick="withdraw();">提现<..
uni-app 运行到app 报错 TypeError
qq_42375208的博客
08-27 2100
uni-app 运行到app 报错 TypeError: r[t] is not a function. (In ‘rt’, 'r[t 云心到手机，模拟器报错： 18:13:57.216 [ERROR] : TypeError: r[t] is not a function. (In ‘rt’, ‘r[t]’ is undefined) 18:13:57.239 [ERROR] : TypeError: undefined is not an object (evaluating ‘r.addVData’)
vue 报 is not defined not a function
qq_33709529的博客
11-20 2299
首先排除语法问题,其实考虑是不是因为方法调用有延迟 ,举个简单例子 就是 调用百度地图 ,vue 的加载速度很快 vue 先于百度地图加载,导致vue 不能识别 调用接口的语法 报错:语法如下 Design:function() { setTimeout(() => { LODOP=getLodop(); eva...
vue h is not a function
03-25
A：这个问题通常发生在使用Vue组件时，如果在组件中使用 `h()` 函数创建虚拟DOM节点，并且出错提示为 `h is not a function`，则可能是因为没有在Vue实例中注册 `createElement` 函数。可以在Vue组件中加入以下代码...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值