Vue self removing initializer with external props

Component.vue

<template>
    <div>
        {{ foo }}
        {{ helloWorld }}
    </div>
</template>

<script>
export default {
    name: 'entry-component',
    props: [ 'foo', 'helloWorld' ]
};
</script>

entry.js

import Vue from 'vue';
import Component from './Component';

const currentScript = document.currentScript || (function() {
    const scripts = document.getElementsByTagName('script');
    return scripts[scripts.length - 1];
})();

if (currentScript) {
    const propsData = {};
    for (let k in currentScript.dataset) {
        propsData[k] = JSON.parse(currentScript.dataset[k]);
    }

    const AssessmentList = new Vue({
        el: currentScript,
        propsData,
        ...Component
    });
}

template.html.twig

<script src="entry.js"
    data-foo="{{ 'bar'|json_encode }}"
    data-hello-world="{{ ({ hello: 'world' })|json_encode }}"
></script>