search

scniro / react-codemirror2

Codemirror integrated components for React
MIT License
1.65k stars 192 forks source link

There is no style when I introduce the js and css files into the React project #248

Open LS-LILEI opened 3 years ago

LS-LILEI commented 3 years ago

this is my code Importing styles has no effect ` // Import the code mirror component. import {Controlled as CodeMirror} from 'react-codemirror2';

// The following two imports is for the theme. import '../lib/libraries/extensions/python/codemirror.css'; import 'codemirror/theme/material.css';

// This import is for the language syntax highlighting. import 'codemirror/mode/python/python.js';

//...

render () { return ( <AssetPanel buttons={[{ title: '新增代码', img: surpriseIcon, onClick: this.handleAddPython }]} items={[]} selectedItemIndex={this.state.selectedSoundIndex}

<CodeMirror value={val} options={options} /> ); }

`

kennguyen0303 commented 3 years ago

You may want to try require instead of import for the css files. I guess your paths are not correct. According to the sample demo, the paths to import should be 

require('codemirror/lib/codemirror.css');
require('codemirror/theme/material.css');
require('codemirror/theme/neat.css');
require('codemirror/mode/xml/xml.js');
require('codemirror/mode/javascript/javascript.js');

This is the code from reactJs, but maybe try this path and see if it helps.