How to fix style modules that crash when using mixins in vue 2 + TS?

Question

Vue.js

import * as Template from './_template.html?style=./_styles.scss'; // LOCAL STYLES, LOADER CONFIGURED

import {Component, Vue}                                    from 'vue-property-decorator';
import {mixins}                                            from 'vue-class-component';
import LoadingModalScreenMixin                             from '@/mixin/store/common/LoadingModalScreenMixin';

@Template
@Component<Menu>(
    {
        mixins:     [],
        components: {
        },
        directives: {
        },
    },
)

export default class Menu extends mixins(LoadingModalScreenMixin) { // ERROR
export default class Menu extends Vue { // WORKS

[Vue warn]: Error in mounted hook: "TypeError: Cannot read properties of undefined (reading 'nav_menu')"

found in

---> <Menu>
       <LayoutBasic>
         <Root>
...
vue.runtime.esm.js?2b0e:1897 TypeError: Cannot read properties of undefined (reading 'nav_menu')
    at VueComponent.mounted (Menu.ts?b911:196)

mounted(): void {
        console.info(this);
        console.info(this.$style); // undefined
        console.info(this.$style['nav_menu']);  // ERROR with mixins()
    }

webpack config

spoiler

const ScriptExtHtmlWebpackPlugin = require('script-ext-html-webpack-plugin');
const HtmlWebpackPlugin          = require('html-webpack-plugin');
const FriendlyErrorsPlugin       = require('friendly-errors-webpack-plugin');
const webpack                    = require('webpack');
const path                       = require('path');
const MiniCssExtractPlugin = require('mini-css-extract-plugin');
const CopyWebpackPlugin    = require('copy-webpack-plugin');

module.exports         = {
    mode:         'development',
    entry:        [
        './src/main.ts',
    ],
    watch:        true,
    watchOptions: {
        poll: true,
    },
    output:       {
        path:       path.resolve(__dirname, '../dist'),
        filename:   '[name].js',
        publicPath: '/',
    },
    module:       {
        rules: [
            {
                test:    /\.tsx?$/,
                loader:  'ts-loader',
                exclude: /node_modules/,
            },
            {
                test:    /\.html$/,
                loader:  'vue-template-loader',
                include: /src/,
                options: {
                    transformToRequire: {
                        img: 'src',
                    },
                },
            },
            {
                test: /\.css$/,
                use:  [
                    MiniCssExtractPlugin.loader,
                    {
                        loader:  'css-loader',
                        options: {
                            importLoaders:  1,
                            modules:        true,
                            localIdentName: '[local]__[hash:base64:4]',
                            sourceMap:      true,
                        },
                    },
                ],
            },
            {
                test: /\.scss$/,
                use:  [
                    MiniCssExtractPlugin.loader, //'style-loader',
                    {
                        // Interprets `@import` and `url()` as JS `import()/require()` and will resolve them
                        loader:  'css-loader',
                        options: {
                            importLoaders:  1,
                            modules:        true,
                            localIdentName: '[local]__[hash:base64:4]',
                            sourceMap:      true,
                        },
                    },
                    'sass-loader',
                ],
            },
            {
                test:    /\.(png|jpg)$/,
                loader:  'file-loader',
                options: {
                    name: '[name].[ext]?[hash]',
                },
            },
            {
                test: /\.(otf|eot|woff|woff2|ttf|svg)$/,
                use:  [
                    {
                        loader:  'file-loader', // 'url-loader',
                        options: {
                            // limit:      100000,
                            name:       '[name].[ext]',
                            outputPath: 'fonts/',
                        },
                    },
                ],
            },
        ],
    },
    plugins:      [
        new FriendlyErrorsPlugin(),
        new webpack.HotModuleReplacementPlugin(),
        new ScriptExtHtmlWebpackPlugin({
                                           defaultAttribute: 'defer',
                                           preload:          {
                                               test:   /\.js$/,
                                               chunks: 'async',
                                           },
                                       }),
        new MiniCssExtractPlugin({
                                     filename:      '[name].css',
                                     chunkFilename: '[id].css',
                                     ignoreOrder:   false,
                                 }),
        new CopyWebpackPlugin([
                                  {
                                      from: path.join(
                                          __dirname,
                                          '../node_modules/@fortawesome/fontawesome-free/webfonts',
                                      ),
                                      to:   path.join(__dirname, '../dist/static/webfonts/'),
                                  },
                                  {
                                      from: path.join(__dirname, '../static'),
                                      to:   path.join(__dirname, '../dist/static'),
                                  },
                                  {
                                      from: path.join(__dirname, '../public'),
                                      to:   path.join(__dirname, '../dist/'),
                                  },
                              ]),
        new HtmlWebpackPlugin({
                                  title:    'Lilim.tv',
                                  filename: './index.html',
                                  template: './index_dev.html',
                                  inject:   true,
                              }),
    ],
    // externals:    [nodeExternals()],
    devtool:      'eval-source-map',
    // @todo - this is fix https://github.com/vuejs/vue/issues/2873
    resolve:      {
        extensions: ['.ts', '.js', '.json', 'scss'],
        alias:      {
            '@': path.resolve(__dirname, '../src'),
        },
    },
    performance:  {
        hints: 'warning',
    },
    optimization: {
        splitChunks: {
            chunks: 'all',
        },
    },
};