Use eslint to unwrap full dynamic import

[theKashey]

There is a cool feature in loadable-component - full dymanic imports - import('./{prop}'). However, there are problems:

• not possible to check is that file even exists
• no typescript support - it's always any
• no webpack support as well

Loadable uses babel plugin to "unwrap" dynamic import into a set of "static" imports, which is still not helping with TypeScript.

Idea:

• use eslint to "unroll" full dynamic imports into big "switches", giving a user full control and visibility, still not forcing to write the code by themselves.
• use the same plugin to maintain the "completeness" of the list - of one more file should be added - the rule should fail.

Example

imported(() => `./pages/${x}`);
// error: blablabla, autofix
⬇️⬇️⬇️⬇️
importedSwitch(x, () => {
  switch(x) {
    case 'page1': return imported(() => `./pages/${x}`);
    case 'page2': return imported(() => `./pages/${x}`);
    default: throw
});
⬇️⬇️⬇️⬇️
// error: blah-blah, page3 is missing, autofix