securingsincity / react-ace

React Ace Component

Home Page:http://securingsincity.github.io/react-ace/

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

React build failed

Winterspringkle opened this issue · comments

image
If I add the react-ace module, the "yarn start" progress is normal, but "react build" progress failed in server compiling and reports the error above.
Why could this happen?
Here are my codes:

import AceEditor from "react-ace";
import "ace-builds/src-noconflict/mode-python";
import "ace-builds/src-noconflict/mode-golang";
import "ace-builds/src-noconflict/mode-java";
import "ace-builds/src-noconflict/theme-monokai";
import "ace-builds/src-noconflict/ext-language_tools";
...
export function CodeBlock(): JSX.Element {
const [pythonCode, setPythonCode]=useState('1')
const [javaCode, setJavaCode]=useState('2')
const [golangCode, setGolangCode]=useState('3')
const [code, setCode]=useState(javaCode)
const [current, setCurrent] = useState('java');
const onClick: MenuProps['onClick'] = (e) => {
console.log('click ', e);
setCurrent(e.key);
if (e.key=="python"){
setCode(pythonCode)
}
else if(e.key=="java"){
setCode(javaCode)
}
else if(e.key=="golang"){
setCode(golangCode)
}
}
const items: MenuProps['items'] = [
{label: 'Java',key: 'java'},
{label: 'Go',key: 'golang'},
{label: 'Python3',key: 'python'}]
return (
<div style={{width:"50%"}}>


<AceEditor
// mode="python"
theme="monokai"
name="blah2"
fontSize={14}
showPrintMargin={true}
showGutter={true}
highlightActiveLine={true}
value={code}
readOnly={true}
setOptions={{
enableBasicAutocompletion: false,
enableLiveAutocompletion: false,
enableSnippets: false,
showLineNumbers: true,
useWorker:false,
tabSize: 2
}}
style={{marginTop:"10px",height:"400px",width:"100%"}}/>

)
}

Missing or incompatible dependencies: The react-ace module may have additional dependencies that are not properly installed or are incompatible with your project's configuration. Make sure to check the module's documentation for any specific requirements or dependencies and ensure they are correctly installed.

Configuration issues: React-ace might require certain configuration changes in your project's build process. It's possible that the configuration for the development environment (used by "yarn start") is set up correctly, but the configuration for the production build process (used by "react build") is missing or incorrect. Review your project's configuration files and build scripts to ensure they are properly set up for both development and production environments.

Build process limitations: The react-ace module might introduce complex or heavy dependencies that exceed the limits or capabilities of the build process. For example, if the module relies on large external libraries or resources, it could result in build failures due to memory constraints or other limitations. In such cases, you may need to optimize your build process or consider alternative approaches to incorporating the react-ace functionality into your project.