tc39 / proposal-dynamic-import

import() proposal for JavaScript
https://tc39.github.io/proposal-dynamic-import/
MIT License
1.86k stars 47 forks source link

lazy-loading function in README does not work #66

Open x5engine opened 6 years ago

x5engine commented 6 years ago

Hello all,

<!DOCTYPE html>
<nav>
  <a href="books.html" data-entry-module="books">Books</a>
  <a href="movies.html" data-entry-module="movies">Movies</a>
  <a href="video-games.html" data-entry-module="video-games">Video Games</a>
</nav>

<main>Content will load here!</main>

<script>
  const main = document.querySelector("main");
  for (const link of document.querySelectorAll("nav > a")) {
    link.addEventListener("click", e => {
      e.preventDefault();

      import(`./section-modules/${link.dataset.entryModule}.js`)// this part seems not working at all!
        .then(module => {
          module.loadPageInto(main);
        })
        .catch(err => {
          main.textContent = err.message;
        });
    });
  }
</script>

It is very sad this is still an issue at 2018, I meant I thought this is something normal and expected with dynamic import!!

JQuery had this in 2008 like a decade ago you could import anything in the browser with no issues at all!!

What is this? are going steps back??

aciccarello commented 6 years ago

@meteorplus This repo is a proposal for a feature that is still being standardized. Issues on this repo are meant for problems with the proposal. Browser implementation issues should be be taken up in the respective browser issue tracker. MDN has more information on the implementation status.

If you believe there is an issue with the proposal, providing more information about what you are expecting will probably help the people managing this proposal know how to respond.

x5engine commented 6 years ago

@aciccarello well thanks for the response.

my proposal is to have an allowed path or file which the dynamic import function checks before loading those files something like:

//config allowed imports on the server:

import.config(['path/to/something.js','path/to/a/folder']); //this might be a file path or folder path

//then on the client
const path = "/server/mysuperprivatesecret.js", path2 = "path/to/something.js";
import(path);// this will fail since it's not allowed

import(path2);//will not failt because it is allowed

What do you think?