Project
FrontendLogicPreProcessingTesting.ts
(function executeApplication(): void {
const loadDataButton: HTMLElement | null = document.getElementById("LoadDataButton");
if (loadDataButton !== null) {
loadDataButton.addEventListener("click", async () => {
const loadedValue: string = await loadDataOnDemand();
console.log(loadedValue);
});
}
})();
async function loadDataOnDemand(): Promise<string> {
const MODULE: { default: string; DYNAMICALLY_LOADED_CONST_FROM_TS_MODULE: string; } =
await import("./DynamicLoadingTesting/TypeScriptModuleForDynamicLoading");
return MODULE.DYNAMICALLY_LOADED_CONST_FROM_TS_MODULE;
}
TypeScriptModuleForDynamicLoading.ts
const DYNAMICALLY_LOADED_CONST_FROM_TS_MODULE_BY_DEFAULT: string =
'I was dynamically loaded from TS module by default!';
export default DYNAMICALLY_LOADED_CONST_FROM_TS_MODULE_BY_DEFAULT;
export const DYNAMICALLY_LOADED_CONST_FROM_TS_MODULE: string =
'I was dynamically loaded from TS module!';
It seems like button's click event handler works correclty:
But the module TypeScriptModuleForDynamicLoading.ts
has not been loaded dynamically. It has been bundled to FrontendLogicPreProcessingTesting.js
:
My Webpack config:
{
name: 'FrontendLogicPreProcessingTesting',
context: 'D:\\XXXXX\\00-Source\\FrontendLogicPreProcessingTesting',
target: 'web',
entry: {
FrontendLogicPreProcessingTesting: 'D:/IntelliJ IDEA/InHouseDevelopment/Hikari-Monorepo/ProjectsForFunctionalTesting/ProjectBuildingCommonTest/00-Source/FrontendLogicPreProcessingTesting/FrontendLogicPreProcessingTesting.ts'
},
output: {
path: 'D:\\XXXXX\\01-DevelopmentBuild\\FrontendLogicPreProcessingTesting',
publicPath: './',
filename: '[name].js',
chunkFilename: 'load_on_demand/partial__[id].js'
},
mode: 'development',
watch: true,
devtool: 'eval',
module: {
rules: [/* ... */]
},
resolve: {
extensions: [ '.mjs', '.js', '.ts' ],
alias: { vue: 'vue/dist/vue.common.js' }
},
optimization: { minimize: false, noEmitOnErrors: false }
}
My public path is './'
because I need the dynamical loading works without development server, just by opening the HTML file. I used relative public path before, but now there is the another error somewhere.
from Webpack 4.44.2 loads modules statically instead of requested dynamic loading
No comments:
Post a Comment