Webpack 如何在Ace编辑器中以编程方式添加代码段？

我想将自己的自定义代码段添加到ace编辑器输入框中

我将如何添加它们

根据以下文件：

目前，向项目中添加自定义代码段的唯一方法是创建插件（如下所述）

我看到了一个名为的项目，但它自2016年以来就没有更新过，它做的事情比简单地允许我添加一个片段要多

此外，我使用的是ES6+/ES2015+，因此require语句也很混乱

这就是我想要的结果：

---

经过一些研究，我从ace代码片段扩展中提取了有用的部分。另一个棘手的部分是，代码片段似乎需要某种类型的缩进，我为其创建了一个函数（但没有经过良好测试）

下面是名为

ace snippets extension simple.js的“库”代码：
以下是“消费者”代码的示例：
使用此选项可导入上述内容

import ace from 'ace-builds'
import { Range, EditSession } from 'ace-builds'
import 'ace-builds/src-noconflict/ext-language_tools'
import 'ace-builds/src-noconflict/mode-javascript'
import 'ace-builds/webpack-resolver'

import {
    registerSnippets,
    createSnippets,
} from './ace-snippets-extension-simple'

const editor = ace.edit(/*HTMLElement reference or css selector string*/)

// ...
// ...
// ...

editor.setOptions({
    enableBasicAutocompletion: true,
    enableSnippets: true,
    enableLiveAutocompletion: false,
})

editor.setTheme('ace/theme/monokai')
editor.session.setMode('ace/mode/javascript')

registerSnippets(
    editor,
    editor.session,
    'javascript',
    createSnippets([
        { name: 'build', code: 'console.log("build")' },
        { name: 'destroy', code: 'console.log("destroy")' },
    ])
)

import ace from 'ace-builds'
import { Range, EditSession } from 'ace-builds'
import 'ace-builds/src-noconflict/ext-language_tools'
import 'ace-builds/src-noconflict/mode-javascript'
import 'ace-builds/webpack-resolver'

import {
    registerSnippets,
    createSnippets,
} from './ace-snippets-extension-simple'

const editor = ace.edit(/*HTMLElement reference or css selector string*/)

// ...
// ...
// ...

editor.setOptions({
    enableBasicAutocompletion: true,
    enableSnippets: true,
    enableLiveAutocompletion: false,
})

editor.setTheme('ace/theme/monokai')
editor.session.setMode('ace/mode/javascript')

registerSnippets(
    editor,
    editor.session,
    'javascript',
    createSnippets([
        { name: 'build', code: 'console.log("build")' },
        { name: 'destroy', code: 'console.log("destroy")' },
    ])
)