[Javascript] ES6 다이나믹 모듈 (Dynamic Module)

ES proposal: import() – dynamically importing ES modules
https://2ality.com/2017/01/import-operator.html



* 다중 모듈(파일) 로드 방법

Promise.all([
    import('./module1.js'),
    import('./module2.js'),
    import('./module3.js'),
])
.then(([module1, module2, module3]) => {
    ···
});



//=============================
* 비동기로 여러 모듈 로드
- ECMAScript 2017


async function main() {
    const myModule = await import('./myModule.js');

    const {export1, export2} = await import('./myModule.js');

    const [module1, module2, module3] =
        await Promise.all([
            import('./module1.js'),
            import('./module2.js'),
            import('./module3.js'),
        ]);
}

main();

//============================

배열로 자동화

js 모듈에서 import 자동화

var aFiles = [
    `./vc_js.js`,
    `./vc_js3.js`,
];

var prms = [];
aFiles.map((val) => {
    prms.push(import(val));
})

Promise.all(prms)
    .then(ret => {
        var comps = {};
        ret.map((val) => {
            Object.assign(comps, getImportedObj(val));
        })
        return comps;

    })
    .then(ret => {
        window.vue0 = new Vue({
            el: '#app',
            components: ret,
        });

    })

//====================
// 참고
* import 문
https://developer.mozilla.org/ko/docs/Web/JavaScript/Reference/Statements/import