Code mode (Ace editor) not working inside shadow DOM

Hi,
I want to make a JSON editor custom element. But I meet some problems.
Here is my code:
```html

var template = document.getElementById('custom-template')
class CustomJsonEditor extends HTMLElement {
constructor() {
super();
this._shadowRoot = this.attachShadow({mode: 'open'})
this._shadowRoot.appendChild(template.content.cloneNode(true))
var options = {
mode: 'code',
modes: ["code", "tree"],
};

this.container = this._shadowRoot.querySelector('div');
this.editor = new JSONEditor(this.container, options);
}
}
customElements.define('json-editor', CustomJsonEditor);

```
And the Json editor will become this:
It seems that I need to load the ace theme somewhere, right? I am a beginner on JavaScript. Could you give me some helps? Thank you.