I'm trying to use the Tinymce plugin on a textarea element:

<textarea id="reportDescription" name="reportDescription" class="form-control" rows="4"></textarea>

Im working with Symfony and Webpack Encore. So I installed the package using:

yarn add tinymce

In webpack.config.js I coded:

.copyFiles({
        from: 'node_modules/tinymce/skins',
        to: 'skins/[path]/[name].[ext]'
    })

And in the .js where I'm trying to initialize the plugin:

require('tinymce');

$(document).ready(function () {
   
    if($("#reportDescription").length > 0){
        tinymce.init({
            selector: "textarea#reportDescription"
            
        });
    }
});

When I load my page on my browser, I get this error:

tinymce.js:4680 
    GET http://url/build/models/dom/model.js net::ERR_ABORTED 404 (Not Found)
tinymce.js:18181 
    Failed to load model: dom from url models/dom/model.js
tinymce.js:4680 
    GET http://url/build/icons/default/icons.js net::ERR_ABORTED 404 (Not Found)
tinymce.js:18181 
    Failed to load icons: default from url http://url/build/icons/default/icons.js
tinymce.js:4680 
    GET http://url/build/themes/silver/theme.js net::ERR_ABORTED 404 (Not Found)
tinymce.js:18181 
    Failed to load theme: silver from url themes/silver/theme.js

I don't understand very well yet how to work with modules on webpack. How to import them, when to use require or import and the difference between them. So maybe I'm missing something important.