imguolao / monaco-vue

Use monaco-editor loaded from CDN in Vue 2&3, no need to bundling.
https://imguolao.github.io/monaco-vue/
MIT License
232 stars 21 forks source link

在vue 2.6.14使用时报错无法使用 #10

Closed Nobilta closed 1 year ago

Nobilta commented 1 year ago

vue版本 2.6.14,已安装@vue/composition-api,在单页引入后报错

Module parse failed: Unexpected token (49:14)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders      
|   const unload = () => monacoLoader.cancel();
|   monacoLoader.then(monacoInstance => monacoRef.value = monacoInstance).catch(error => {
>     if (error?.type !== "cancelation") {
|       console.error("Monaco initialization error:", error);
|     }
imguolao commented 1 year ago

你的 webacpk 无法处理 ?.,配一下 babel loader,include 加上 @guolao/vue-monaco-editor

imguolao commented 1 year ago

fixed in version@1.1.1

Suport to es2017 now.

Nobilta commented 1 year ago

fixed in version@1.1.1

Suport to es2017 now.

确实修复了这个问题 但是demo中的CreateApp()在vue2.6.14中似乎并不支持(引入App.vue后使用New Vue()似乎也无效),控制台提示:

TypeError: Object(...) is not a function
imguolao commented 1 year ago

createApp@vue/composition-api 中导出,API 不熟的话可以去看下文档。

也可以看下这个 例子

Nobilta commented 1 year ago

createApp@vue/composition-api 中导出,API 不熟的话可以去看下文档。

也可以看下这个 例子

非常感谢,完美解决问题

apertureless commented 1 year ago

I also have trouble getting this to work with vue 2.6.14

In my main.ts I have imported vue-composition api

import VueCompositionAPI from '@vue/composition-api'
Vue.use(VueCompositionAPI)

And then I have a simple editor component

  <div style="height: 100%;">
    <Editor
      height="80vh"
      theme="vs-dark"
    />
  </div>
</template>

<script lang="ts">
import { defineComponent, ref, computed } from '@vue/composition-api'
import Editor from '@guolao/vue-monaco-editor'
export default defineComponent({
components: { Editor },
setup () {
}
})
</script>

However I am getting TypeError: Object(...) is not a function error. I've tried to add monaco-vue to transpile-dependencies in vue.config.js but it did not work.

Using webpack btw.

imguolao commented 1 year ago

I am not able to reproduce it.

Can you provide a gihub repository that reproduce this issue? @apertureless