typescript - webpack による動的インポート

Question

動的インポートの実装に問題があります (概念を理解していないだけかもしれません)。

で書かれたvue.jsアプリケーションがtypescriptありますwebpack。すべてのフレームワークは最新の安定版です。このアプリケーションがプラグイン コンポーネントをサポートすることを望みます。プラグインはアプリケーション構成で定義され、動的インポートで読み込まれ、どこかに表示できます。

Webpack 構成で 2 つの個別の構成をセットアップします。1 つはアプリ用、もう 1 つはプラグイン用です。

webpack.config.js:

...
var main = Object.assign({
        entry: {
           Home: './ViewModels/Home/main.ts'
        },
        output: {
            path: path.join(__dirname, "./Scripts/dist/"),
            filename: "[name].js",
            chunkFilename: '[name].js'
        },
    },
    vueJsConfig);

var testChunkConfig = Object.assign({
        entry: {
           TestChunk: './ViewModels/Test/registrations.ts'
        },
        output: {
            path: path.join(__dirname, "./Scripts/dist/"),
            filename: "[name].js",
            chunkFilename: '[name].js'
        },
    },
    vueJsConfig);


module.exports = [main, testChunkConfig];

`~/ViewModels/TestChunk/registrations.ts':

import Vue from "vue";
Vue.component('testExternal', require('./testExternalComponent.vue').default);

`~/ViewModels/Home/main.ts':

...
let test = "TestChunk";
import(test);
...

使用法： ~/ViewModels/Components/ProjectAdministration/Test/projectAdminTest.vue

<template>
    <div>
        <h2>Test Page</h2>
        <testExternal></testExternal>
    </div>
</template>

残念ながら、これはエラーを示しています：

Uncaught (in promise) Error: Cannot find module 'TestChunk'
    at eval (eval at ./ViewModels/Home lazy recursive