Vue整合Monaco组件报错

vue整合monaco组件

报错信息:

ERROR in ./node modules/monaco-editor/esm/vs/language/typescript/tsMode.js

Module build failed (from ./node modules/babel-loader/lib/index.js):SmntaxEror: D: coadelwetProjectlowmn myoj-infront node modules manaco-editorlesnmvs langlageltypescript tsbode.js: Statitc clas blocks are not enabed. please add &babelplugin-transfom-classtatic-block to your configuration

报错图片如下:

错误的根本原因是因为导入monaco时使用了这个语句:

复制代码
import * as monaco from "monaco-editor";

解决办法:

1.执行

bash 复制代码
npm install --save-dev @babel/plugin-transform-class-static-block

命令,下载依赖

2.打开项目babel.config.js文件,加入下面配置

javascript 复制代码
plugins: ["@babel/plugin-transform-class-static-block"],
复制代码
如图所示:
相关推荐
SZnA14 分钟前
【html】iOS26 液态玻璃实现效果
前端·html
江城开朗的豌豆24 分钟前
Vue组件更新是'立刻'还是'稍等'?揭秘重渲染的异步秘密!
前端·javascript·vue.js
代码老y27 分钟前
Spring Boot + MyBatis + Vue:打造高效全栈应用的黄金组合
vue.js·spring boot·mybatis
Your易元3 小时前
设计模式-状态模式
java·前端·算法·设计模式
网络点点滴5 小时前
将项目推到Github
javascript·github
HaanLen5 小时前
React19源码系列之 Hooks (useState、useReducer、useOptimistic)
服务器·前端
yuanyxh7 小时前
《精通正则表达式》精华摘要
前端·javascript·正则表达式
小飞大王6668 小时前
简单实现HTML在线编辑器
前端·编辑器·html
Jimmy8 小时前
CSS 实现卡牌翻转
前端·css·html
百万蹄蹄向前冲8 小时前
大学期末考,AI定制个性化考试体验
前端·人工智能·面试