vue简单集成ace editor代码编辑器

由于项目中需要在前端编写一些yaml,json格式的配置文件。一开始用的codemirror集成到项目中有很多问题,故转而使用ace Editor。

首先引入基本依赖

        //核心依赖
        { src: 'https://cdn.bootcdn.net/ajax/libs/ace/1.4.9/ace.js' },
        { src: 'https://cdn.bootcdn.net/ajax/libs/ace/1.4.9/ext-beautify.js' },
        { src: 'https://cdn.bootcdn.net/ajax/libs/ace/1.4.9/ext-language_tools.js' },
        //编辑器主题，选自己需要的~~~~
        { src: 'https://cdn.bootcdn.net/ajax/libs/ace/1.4.9/theme-xcode.js' },
        //语言支持，根据需求添加
        { src: 'https://cdn.bootcdn.net/ajax/libs/ace/1.4.9/mode-yaml.js' },
        { src: 'https://cdn.bootcdn.net/ajax/libs/ace/1.4.9/mode-javascript.js' },
        { src: 'https://cdn.bootcdn.net/ajax/libs/ace/1.4.9/mode-json.js' },

编写组件（复制粘贴）

使用