Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Can't import absolute URLs, e.g. from CDN

See original GitHub issue

🐛 bug report

import('https://...cdn_path.../module.min.js') fails with:

Only absolute URLs are supported Failed to install https

The code works just fine without Parcel when I open index.html in Chrome.

What am I doing wrong? Failing to load CDN libraries seems like a blatant omission.

🎛 Configuration (.babelrc, package.json, cli command)

Zero config.

🤔 Expected Behavior

Server launches.

😯 Current Behavior

$ npx parcel index.html
Server running at http://localhost:1234 
npm ERR! Only absolute URLs are supported

npm ERR! A complete log of this run can be found in:
npm ERR!     /home/dandv/.npm/_logs/2018-12-04T20_24_06_209Z-debug.log
🚨  /home/dandv/prg/importcdn/index.js:1:7: Failed to install https:.
> 1 | import('https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.11/lodash.min.js').then(lodash => {
    |       ^
  2 |   console.log(_.VERSION);
  3 | });
  4 |

🔦 Context

I’m trying to load from CDN a bunch of libraries I don’t want to host myself.

💻 Code Sample

index.html:

<html>
<body>
<script src="index.js"></script>
</body>
</html>

index.js:

import('https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.11/lodash.min.js').then(lodash => {
  console.log(_.VERSION);
});

🌍 Your Environment

Software	Version(s)
Parcel	1.10.3
Node	11.3.0
npm/Yarn	6.4.1
Operating System	Ubuntu Linux 16.04

Issue Analytics

State:
Created 5 years ago
Reactions:4
Comments:6 (3 by maintainers)

Top GitHub Comments

3reactions

cekvenich2commented, Aug 29, 2021

Is there an example of the import() syntax for v2?

1reaction

dandvcommented, Dec 11, 2018

Thanks for the fix for JS!

I still see the issue with importing CSS:

import('https://use.fontawesome.com/releases/v5.5.0/css/all.css');
import('https://cdnjs.cloudflare.com/ajax/libs/lodash.js/4.17.11/lodash.min.js').then(lodash => {
  console.log(_.VERSION);
});

Browser console:

4.17.11 all.css:1 Failed to load module script: The server responded with a non-JavaScript MIME type of “text/css”. Strict MIME type checking is enforced for module scripts per HTML spec. localhost/:1 Uncaught (in promise) TypeError: Failed to fetch dynamically imported module: https://use.fontawesome.com/releases/v5.5.0/css/all.css