Hinzufügen von NPM-Abhängigkeiten - no loaders are configured to process this file

Moin moin,

nach dieser Anleitung (https://developer.shopware.com/docs/guides/plugins/plugins/plugin-fundamentals/using-npm-dependencies) habe ich ein Modul integriert. Nun erhalte ich jedoch folgende Fehlermeldung:

Scanner.vue 1:0
Module parse failed: Unexpected token (1:0)
You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See Concepts | webpack

Jemand eine Idee, wie ich die Problematik gelöst bekomme? Vue ist für mich absolutes Neuland.

Viele Grüße
Benny

Nun bin ich einen kleinen Schritt weiter. :-/

Der loader ist nun eigentlich?! konfiguriert. Hier meine webpack.config.js

const { join, resolve } = require('path');
const { VueLoaderPlugin } = require('vue-loader');

module.exports = () => {
    return {
        resolve: {
            alias: {
                'VueQuagga': resolve(
                    join(__dirname, '..', 'node_modules', 'vue-quaggajs')
                )
            }
        },
        module: {
            rules: [
                {
                    test: /\.vue$/,
                    loader: 'vue-loader'
                },
            ]
        },
        plugins: [
            // make sure to include the plugin for the magic
            new VueLoaderPlugin()
        ]
    };
}

Nun erhalte ich folgende Meldung:


TypeError: Cannot read properties of undefined (reading 'NormalModule')
    at VueLoaderPlugin.apply (/var/www/html/custom/plugins/WdWarenWirtschaft/src/Resources/app/administration/node_modules/vue-loader/dist/pluginWebpack5.js:44:47)
    at webpack (/var/www/html/vendor/shopware/administration/Resources/app/administration/node_modules/webpack/lib/webpack.js:51:13)
    at /var/www/html/vendor/shopware/administration/Resources/app/administration/node_modules/webpack/lib/webpack.js:36:39
    at Array.map (<anonymous>)
    at webpack (/var/www/html/vendor/shopware/administration/Resources/app/administration/node_modules/webpack/lib/webpack.js:36:24)
    at processOptions (/var/www/html/vendor/shopware/administration/Resources/app/administration/node_modules/webpack-cli/bin/cli.js:272:16)
    at /var/www/html/vendor/shopware/administration/Resources/app/administration/node_modules/webpack-cli/bin/cli.js:364:3
    at Object.parse (/var/www/html/vendor/shopware/administration/Resources/app/administration/node_modules/yargs/yargs.js:576:18)
    at /var/www/html/vendor/shopware/administration/Resources/app/administration/node_modules/webpack-cli/bin/cli.js:49:8
    at Object.<anonymous> (/var/www/html/vendor/shopware/administration/Resources/app/administration/node_modules/webpack-cli/bin/cli.js:366:3)
    at Module._compile (node:internal/modules/cjs/loader:1126:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1180:10)
    at Module.load (node:internal/modules/cjs/loader:1004:32)
    at Function.Module._load (node:internal/modules/cjs/loader:839:12)
    at Module.require (node:internal/modules/cjs/loader:1028:19)
    at require (node:internal/modules/cjs/helpers:102:18)
    at Object.<anonymous> (/var/www/html/vendor/shopware/administration/Resources/app/administration/node_modules/webpack/bin/webpack.js:156:2)
    at Module._compile (node:internal/modules/cjs/loader:1126:14)
    at Object.Module._extensions..js (node:internal/modules/cjs/loader:1180:10)
    at Module.load (node:internal/modules/cjs/loader:1004:32)
    at Function.Module._load (node:internal/modules/cjs/loader:839:12)
    at Function.executeUserEntryPoint [as runMain] (node:internal/modules/run_main:81:12)
    at node:internal/main/run_main_module:17:47
makefile:30: recipe for target 'watch-admin' failed

Ich denke mir, eigentlich kann das doch nicht so unmöglich kompliziert sein. -.-
Kann mir bitte jemand helfen? ich verzweifle so langsam.