Add suneditor css file with symfony webpack-encore - symfony

Question

I'm trying to ad suneditor to a symfony project using webpak-encore , I have created a js file
htmlEditor.js
with this code
import SUNEDITOR from 'suneditor'
import 'suneditor/dist/css/suneditor.min.css'
import plugins from 'suneditor/src/plugins'
const editor = SUNEDITOR.create((document.getElementById('appbundle_popup_description') || 'appbundle_popup_description'),{
// All of the plugins are loaded in the "window.SUNEDITOR" object in dist/suneditor.min.js file
// Insert options
// Language global object (default: en)
//lang: SUNEDITOR_LANG['en'],
height: 400,
plugins: plugins,
buttonList: [
['undo', 'redo'],
['font', 'fontSize', 'formatBlock'],
['paragraphStyle', 'blockquote'],
['bold', 'underline', 'italic', 'strike', 'subscript', 'superscript'],
['fontColor', 'hiliteColor', 'textStyle'],
['removeFormat'],
'/', // Line break
['outdent', 'indent'],
['align', 'horizontalRule', 'list', 'lineHeight'],
['table', 'link', 'image', 'video', 'audio' /** ,'math' */], // You must add the 'katex' library at options to use the 'math' plugin.
/** ['imageGallery'] */ // You must add the "imageGalleryUrl".
['fullScreen', 'showBlocks', 'codeView'],
['preview', 'print'],
['save', 'template']
]
});
then I've included an entry in webpack.config.js
.addEntry('htmlEditor', './assets/js/htmlEditor.js')
and I've included the files at the view file
{% block stylesheets %}
{{ parent() }}
{{ encore_entry_link_tags('htmlEditor') }}
{% endblock %}
{% block javascripts %}
{{ parent() }}
{{ encore_entry_script_tags('htmlEditor') }}
{% endblock %}
and then the js file ins included but not the css file, how can I include the css file ?

Answer 1

I have the same problem.
I have a solution for waiting a better solution.
Invcude the CDN in your html after the block javascript in your html head
<link href="https://cdn.jsdelivr.net/npm/suneditor#latest/dist/css/suneditor.min.css" rel="stylesheet">
Better solution
copy the files
suneditor/src/assets/css/suneditor-contents.css for the editing part
and
suneditor/src/assets/css/suneditor.css for your view
After import in your app.js
import '../assets/suneditor-contents.css'
and for your back
import '../assets/suneditor.css'