React-ace: Ошибка Π² консоли, Π½Π΅ влияСт Π½Π° Ρ€Π°Π±ΠΎΡ‚Ρƒ ΠΊΠΎΠΌΠΏΠΎΠ½Π΅Π½Ρ‚Π°. Но это Ρ€Π°Π·Π΄Ρ€Π°ΠΆΠ°Π΅Ρ‚.

Π‘ΠΎΠ·Π΄Π°Π½Π½Ρ‹ΠΉ Π½Π° 11 Ρ„Π΅Π²Ρ€. 2020  Β·  3ΠšΠΎΠΌΠΌΠ΅Π½Ρ‚Π°Ρ€ΠΈΠΈ  Β·  Π˜ΡΡ‚ΠΎΡ‡Π½ΠΈΠΊ: securingsincity/react-ace

ΠŸΡ€ΠΎΠ±Π»Π΅ΠΌΠ°

Ошибки ΠΏΡ€ΠΈ ΠΈΠΌΠΏΠΎΡ€Ρ‚Π΅ Π½Π΅ΡΠΊΠΎΠ»ΡŒΠΊΠΈΡ… Ρ€Π΅ΠΆΠΈΠΌΠΎΠ²

a8a2cc68-d2aa-4415-8e0e-e9de7978ead3:1 Refused to execute script from 'http://localhost:3000/worker-css.js' because its MIME type ('text/html') is not executable.
(anonymous) @ a8a2cc68-d2aa-4415-8e0e-e9de7978ead3:1
a8a2cc68-d2aa-4415-8e0e-e9de7978ead3:1 Uncaught DOMException: Failed to execute 'importScripts' on 'WorkerGlobalScope': The script at 'http://localhost:3000/worker-css.js' failed to load.
    at blob:http://localhost:3000/a8a2cc68-d2aa-4415-8e0e-e9de7978ead3:1:1

Π­Ρ‚ΠΈ ошибки Π½ΠΈΡ‡Π΅Π³ΠΎ Π½Π΅ портят, всС Ρ€Π°Π±ΠΎΡ‚Π°Π΅Ρ‚ ΠΈ удаСтся ΡƒΡΠΏΠ΅ΡˆΠ½ΠΎ ΠΈΠ·ΠΌΠ΅Π½ΠΈΡ‚ΡŒ Ρ€Π΅ΠΆΠΈΠΌ.
Π― даю ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»ΡŽ Π²ΠΎΠ·ΠΌΠΎΠΆΠ½ΠΎΡΡ‚ΡŒ Π²Ρ‹Π±ΠΈΡ€Π°Ρ‚ΡŒ Ρ€Π°Π·Π½Ρ‹Π΅ Ρ€Π΅ΠΆΠΈΠΌΡ‹ (css, javascript, python ΠΈ Ρ‚. Π”.). ΠŸΠΎΡΡ‚ΠΎΠΌΡƒ я ΠΏΡ€ΠΎΠ³Ρ€Π°ΠΌΠΌΠ½ΠΎ ΠΈΠΌΠΏΠΎΡ€Ρ‚ΠΈΡ€ΡƒΡŽ Ρ€Π΅ΠΆΠΈΠΌΡ‹ Π½Π° основС Ρ‚ΠΎΠ³ΠΎ, Ρ‡Ρ‚ΠΎ ΠΏΠΎΠ»ΡŒΠ·ΠΎΠ²Π°Ρ‚Π΅Π»ΡŒ Π·Π°ΠΏΡ€Π°ΡˆΠΈΠ²Π°Π΅Ρ‚ Π² спискС Π²Ρ‹Π±ΠΎΡ€Π°.

ΠŸΡ€ΠΈΠΌΠ΅Ρ€ ΠΊΠΎΠ΄Π° для воспроизвСдСния вашСй ΠΏΡ€ΠΎΠ±Π»Π΅ΠΌΡ‹

// This runs whenever a new mode is selected by the user
    const handleModeChange = (event) => {
      var currentMode = event.target.value;
      require(`ace-builds/src-noconflict/mode-${currentMode}`)
      setState({...state, currentMode})
    }


            <AceEditor
              mode={state.currentMode}
              width="100%"
              theme="twilight"
              value={state.code}
              onChange={onChange}
              name="code_editor"
              editorProps={{ $blockScrolling: true }}
            /> 

Π‘Π°ΠΌΡ‹ΠΉ ΠΏΠΎΠ»Π΅Π·Π½Ρ‹ΠΉ ΠΊΠΎΠΌΠΌΠ΅Π½Ρ‚Π°Ρ€ΠΈΠΉ

РСшСниС:

Π­Ρ‚ΠΎ Π±Ρ‹Π»ΠΎ Ρ€Π΅ΡˆΠ΅Π½ΠΎ послС Ρ‚ΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ я Π΄ΠΎΠ±Π°Π²ΠΈΠ» import "ace-builds/webpack-resolver"
Π‘ΠΌ. Https://github.com/securingsincity/react-ace/issues/725#issuecomment -543109155

ВсС 3 ΠšΠΎΠΌΠΌΠ΅Π½Ρ‚Π°Ρ€ΠΈΠΉ

ΠŸΠΎΠ»ΡƒΡ‡Π΅Π½ΠΈΠ΅ Ρ‚ΠΎΠΉ ΠΆΠ΅ ошибки

import AceEditor from "react-ace"

import "ace-builds/src-noconflict/mode-javascript"
import "ace-builds/src-noconflict/theme-monokai"
//...
  <AceEditor
      name="Ace-editor"
      mode="javascript"
      fontSize={15}
      wrapEnabled={true}
      value={beautify(JSON.stringify(state.stepDetails))}
      theme="monokai"
      onChange={handleSchemaChange}
      enableBasicAutocompletion={true}
      enableLiveAutocompletion={true}
      editorProps={{ $blockScrolling: true }}
    />

РСшСниС:

Π­Ρ‚ΠΎ Π±Ρ‹Π»ΠΎ Ρ€Π΅ΡˆΠ΅Π½ΠΎ послС Ρ‚ΠΎΠ³ΠΎ, ΠΊΠ°ΠΊ я Π΄ΠΎΠ±Π°Π²ΠΈΠ» import "ace-builds/webpack-resolver"
Π‘ΠΌ. Https://github.com/securingsincity/react-ace/issues/725#issuecomment -543109155

Бпасибо @ pi0neerpat !

Π‘Ρ‹Π»Π° Π»ΠΈ эта страница ΠΏΠΎΠ»Π΅Π·Π½ΠΎΠΉ?
0 / 5 - 0 Ρ€Π΅ΠΉΡ‚ΠΈΠ½Π³ΠΈ