How to lazy load my js component?

Questions
1

I configured my framework7 project using webpack. I’m looking to load only those components which are needed on current page.My code is:-

$$(document).on('page:init','.page[data-name="home"]',function(e,page){
    import HomeScreenUtilities from './HomeScreen.js';
});

But import statements are only allowed at the top of the file. How can i achieve this?

2

Check how imports work https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/import