У меня проблемы с реализацией динамического импорта (возможно, у меня просто нет понимания концепции).
У меня есть vue.js
приложение, написанное на typescript
с webpack
. Все фреймворки являются последними стабильными версиями. Я хотел бы, чтобы это приложение поддерживало компоненты плагина. Плагин определяется в конфигурации приложения, а затем загружается с динамическим импортом и может быть где-то показан.
Я настроил две отдельные конфигурации в конфигурации Webpack, одну для приложения, другую для плагина:
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 / Главная / 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