摩纳哥编辑电子与反应

时间:2018-05-15 08:43:12

标签: javascript node.js reactjs electron monaco-editor

前言

我不是网络开发者。我再说一遍,我不是一名网络开发人员。我刚刚开始进入npm,JS,TS,React等来自非常移动/桌面的背景。拜托巴尼风格的任何答案,请对此表示愚蠢。

概要

我尝试使用Monaco EditorElectron ReactElectron Forge一起使用closest SO post I found。但是,我不理解我收到的错误。我已经阅读了一些关于微软做出一些人们多年来遇到问题的AMD负载的非标准方式的问题。根据我的发现,我无法确定解决方案Ace Editor没有答案。我为Docx4j Enterprise尝试了相同的过程,它运作得很好;但是,如果可能的话,我强烈更喜欢在我的应用程序中使用Monaco编辑器。

Electron + React + Monaco

$ electron-forge init electron-monaco-test --template=react
$ cd electron-monaco-test
$ yarn add react-monaco-editor

然后我将 src / app.jsx 编辑为:

import React from 'react';
import MonacoEditor from 'react-monaco-editor';

export default class App extends React.Component {
  render() {
    return <MonacoEditor language='javascript' />;
  }
}

然后:

$ npm start

我收到引用module.js:545的以下错误:

  

未捕捉错误:无法找到模块&#39; monaco-editor&#39;       在Module._resolveFilename(module.js:543:15)       在Function.Module._resolveFilename(/Users/Zac/Dev/electron-monaco-test/node_modules/electron/dist/Electron.app/Contents/Resources/electron.asar/common/reset-search-paths.js:35: 12)       在Function.Module._load(module.js:473:25)       在Module.require(module.js:586:17)       at require(internal / module.js:11:18)       在对象。 (/Users/Zac/Dev/electron-monaco-test/node_modules/react-monaco-editor/lib/editor.js:11:21)       在对象。 (/Users/Zac/Dev/electron-monaco-test/node_modules/react-monaco-editor/lib/editor.js:188:3)       在Module._compile(module.js:642:30)       at Object.require.extensions。(匿名函数)[as .js](/Users/Zac/Dev/electron-monaco-test/node_modules/electron-compile/lib/require-hook.js:77:14)       在Module.load(module.js:561:32)

我还尝试添加monaco-editor作为直接项目依赖项,但这也不起作用。

Electron + React + Ace Editor

当我将完全相同的过程应用于Ace Editor时,它就可以正常工作。

$ electron-forge init electron-ace-test --template=react
$ cd electron-ace-test
$ yarn add react-ace

的src / app.jsx

import React from 'react';
import AceEditor from 'react-ace'

import 'brace/theme/github'
import 'brace/mode/javascript'

export default class App extends React.Component {
  render() {
    return (
      <AceEditor
        mode='javascript'
        theme='github' />
    );
  }
}

然后:

$ npm start

有关如何修复摩纳哥设置的任何建议吗?

0 个答案:

没有答案