Error tabs on webpack encore

Hello, I just purchased MDB pro and I am facing some issues with the "Material tabs" component.

The styles of the header table links is not working, neither the links itselves. The hide / show behaviour is not working.

I am using Symfony with webpack encore and this is my configuration:

webpack.config.js:

var Encore = require('@symfony/webpack-encore');

//yarn add copy-webpack-plugin --dev
const CopyWebpackPlugin = require('copy-webpack-plugin');

Encore
// the project directory where compiled assets will be stored
.setOutputPath('public/build')
// the public path used by the web server to access the previous directory

.setPublicPath('/build')

//.addStyleEntry('css/app', './assets/css/app.scss')
.addEntry('app', './assets/js/app.js')

.enableSingleRuntimeChunk()
.cleanupOutputBeforeBuild()
.enableSourceMaps(!Encore.isProduction())
// uncomment to create hashed filenames (e.g. app.abc123.css)
.enableVersioning(Encore.isProduction())

// uncomment to define the assets of the project


// uncomment if you use Sass/SCSS files
.enableSassLoader(function(options) {
    options.includePaths = ['node_modules']
})
.addPlugin(new CopyWebpackPlugin([
    // copies to {output}/static
    { from: './assets/js', to: 'js', ignore: 'app.js'},
    { from: './assets/img', to: 'img' }
]))

// uncomment for legacy applications that require $/jQuery as a global variable
.autoProvidejQuery()

module.exports = Encore.getWebpackConfig();

app.scss:

@import "~mdbootstrap-pro/scss/mdb";

The content of the html is exactly what I found in this link