在vue项目中引入ace编辑器

第九人称

于 2022-12-10 18:48:11 发布

阅读量2.5k

点赞数 3

文章标签： vue.js javascript 前端

版权

1.安装依赖，可以在图形化界面的依赖中直接搜索

vue3-ace-editor

2.引入组件

import { VAceEditor } from 'vue3-ace-editor';
import ace from 'ace-builds';

3.在setup中放入

ace.config.set(
        "basePath", 
        "https://cdn.jsdelivr.net/npm/ace-builds@" + require('ace-builds').version + "/src-noconflict/");

4.使用组件

<VAceEditor @init="editorInit"
            lang="c_cpp"
            theme="textmate"
            style="height: 300px" />