Uncaught TypeError: Cannot set property 'diff_match_patch' of undefined, vue.js, diff-match-patch, veu-diff-match-patch

Question

this my first post. I'm pretty desperate. I'm trying to build an app based von vuejs, vuetify and vue-diff-patch-match. vue-diff-match-patch. I'm not a coder but a MD. I'm trying to build a text generating tool for ER patients so we can speed up our documentation process and have more actual time for our patients.

Unfortunately when im compiling my project I get this error:

Uncaught TypeError: Cannot set property 'diff_match_patch' of undefined

see full error message:

Uncaught TypeError: Cannot set property 'diff_match_patch' of undefined
at eval (diffMatchPatch.js?8344:2189)
at Module../src/utils/diffMatchPatch.js (app.js:1519)
at __webpack_require__ (app.js:785)
at fn (app.js:151)
at eval (cjs.js?!./node_modules/babel-loader/lib/index.js!./node_modules/vuetify-loader/lib/loader.js?!./node_modules/cache-loader/dist/cjs.js?!./node_modules/vue-loader/lib/index.js?!./src/components/SemanticDiff.vue?vue&type=script&lang=js&:7)
at Module../node_modules/cache-loader/dist/cjs.js?!./node_modules/babel-loader/lib/index.js!./node_modules/vuetify-loader/lib/loader.js?!./node_modules/cache-loader/dist/cjs.js?!./node_modules/vue-loader/lib/index.js?!./src/components/SemanticDiff.vue?vue&type=script&lang=js& (app.js:958)
at __webpack_require__ (app.js:785)
at fn (app.js:151)
at eval (SemanticDiff.vue?f2f4:1)
at Module../src/components/SemanticDiff.vue?vue&type=script&lang=js& (app.js:1411)

I've been doing a lot of googeling, searching on stackoverflow and trial and error... but I couldn't get any further.

I have no idea if its the component, the underlying diffmatchpatch js lib, webpack or sth else...

I'd be grateful for any hint!

THX in advance!

Actual Code:

    <template>
<sem-diff :left="text1" :right='text2'></sem-diff>
</template>

I've tried it in two ways:

1. direct Import of diffmatchpatch + copying the code into my own component:import { diff_match_patch, DIFF_EQUAL, DIFF_DELETE, DIFF_INSERT } from '../utils/diffMatchPatch'
2. import of component,

import SemanticDiff from './SemanticDiff';
export default {
name: 'Covid19',
components: {
    TiptapVuetify,
    RichText,
    //'diff': Diff,
    //'line-diff': LineDiff,
    'sem-diff': SemanticDiff,
    //'processing-diff': ProcessingDiff,
},    
data() {
    return {
        //left: '',
        //right: '',
        //id: null,
        //html: '',
        text1: 'I am the very model of a modern Major-General, \n I\'ve information vegetable, animal, and mineral\n',
        text2: 'I am the very model of a cartoon individual,\n My animation\'s comical, unusual, and whimsical\n',

no matter if I import directly diffMatchPatch or via component -> same error. I found this at the end of the diffMatchPatch Lib:

// Export these global variables so that they survive Google's JS compiler.
// In a browser, 'this' will be 'window'.
// Users of node.js should 'require' the uncompressed version since Google's
// JS compiler may break the following exports for non-browser environments.
this['diff_match_patch'] = diff_match_patch;
this['DIFF_DELETE'] = DIFF_DELETE;
this['DIFF_INSERT'] = DIFF_INSERT;
this['DIFF_EQUAL'] = DIFF_EQUAL;

export { diff_match_patch, DIFF_DELETE, DIFF_INSERT, DIFF_EQUAL };

maybe the compiler breaks the code?