vue加webpack项目导入monaco-editor编辑器就报错，这是为什么？

Question

问题描述

vue加webpack项目导入monaco-editor，控制台就报错

问题出现的环境背景及自己尝试过哪些方法

网上找不到解决方法

相关代码

// 请把代码文本粘贴到下方（请勿用图片代替代码）

import * as monaco from 'monaco-editor'
export default {
    data() {
        return {}
    },
    created() {
        this.initEditor()
    },
    methods: {
        initEditor() {
            monaco.editor.create(document.getElementById('container'), {
                value: 'console.log("Hello, world")',
                language: 'javascript'
            })
        }
    }
}

你期待的结果是什么？实际看到的错误信息又是什么？

导入不报错，编辑器能正常使用。

Answer 1

可能你已经找到答案了
可能我的答案因为环境问题你用了也不行
不过我还是说下

我是在electron-vue 里使用的，monaco-editor是0.18.1
也遇到类似的问题，网上的答案都不行，但最终还是找到了一个答案

先装插件monaco-editor-webpack-plugin

修改webpack.base.conf.js配置文件，这些和网上的答案一样
const MonacoWebpackPlugin = require('monaco-editor-webpack-plugin')

module.exports = {
...
plugins: [

...
new MonacoWebpackPlugin()

]
};

区别在引入的时候
import * as monaco from 'monaco-editor/esm/vs/editor/editor.api.js'

这样就可以了
你可以试试，如果你现在还有兴趣