React-ace: Integrasi dengan react-boilerplate

Dibuat pada 19 Jan 2018 · 7Komentar · Sumber: securingsincity/react-ace

Masalah

Halo teman-teman, saya baru mengenal react-ace, proyek yang sangat bagus, saya sangat menyukainya.
Saya punya pertanyaan yang sangat noob, saya baru saja mem-bootstrap sebuah proyek dengan https://github.com/react-boilerplate/react-boilerplate , menambahkan react-ace sebagai ketergantungan dan semuanya tampaknya berfungsi dengan baik.

Tapi saya mendapatkan kesalahan di atas di konsol:

_mode-mode.js:1 Uncaught SyntaxError: Unexpected token <_

Tampaknya ada sesuatu tentang konfigurasi webpack antara kedua proyek? Bisakah kalian merekomendasikan sesuatu tentang pengaturan ini?

Ini adalah cara saya menggunakan react-ace:

import React, { Component } from 'react';
import AceEditor from 'react-ace';
import messages from './messages';

import 'brace/theme/github';

export default class HomePage extends Component { // eslint-disable-line react/prefer-stateless-function
  render() {
    return (
      <div>
        <AceEditor
          mode=""
          theme="github"
          onChange={() => null}
          name="UNIQUE_ID_OF_DIV"
          editorProps={{ $blockScrolling: true }}
        />
      </div>
    );
  }
}

awaiting response

Sumber

henviso

Komentar yang paling membantu

@henviso Anda perlu mengatur mode dan mengimpor tema dan mode tersebut secara terpisah seperti yang ditunjukkan dalam penggunaan dasar di readme https://github.com/securingsincity/react-ace#basic -usage .

securingsincity pada 19 Jan 2018

👍2

Semua 7 komentar

securingsincity pada 19 Jan 2018

👍2

Itu terjadi pada saya juga, dan saya telah mengumumkan impor itu. Ini kode saya:

import AceEditor from 'react-ace'
import 'brace/mode/python'
import 'brace/theme/monokai'
// ...
<AceEditor
  name="ACE_EDITOR"
  value={this.props.value}
  mode="python"
  theme="monokai"
/>

Ini juga berfungsi, tetapi di konsol itu melempar:
Uncaught SyntaxError: Unexpected token < python.js:1
Dan jika saya membuka file itu, yang dihosting di /snippets/python.js , itu menunjukkan index.html

Jadi tebakan saya adalah saya perlu menambahkan beberapa konfigurasi tambahan pada webpack untuk menyalin JS yang diperlukan ( /brace/snippets/python.js ) ke lokasi publik; menggunakan copy-webpack-plugin .

Ada pikiran?

fbove pada 23 Okt 2018

@fbove Coba impor import brace from 'brace'; di atas impor mode dan tema.
bekerja untuk saya.

IshaTr pada 10 Des 2018

👎1 👍1

@fbove saya memiliki pertanyaan yang sama, dan saya tidak ingin memvalidasi teks dalam bahasa pemrograman apa pun, bagaimana saya bisa mengatur mode