Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

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

Closed
dandv opened this issue Dec 4, 2018 · 6 comments · Fixed by #2380
Closed

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

dandv opened this issue Dec 4, 2018 · 6 comments · Fixed by #2380
Labels
🐛 Bug Good First Issue

Comments

@dandv
Copy link
Contributor

dandv commented Dec 4, 2018

🐛 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
@DeMoorJasper
Copy link
Member

Appears that parcel is trying to resolve that url to a local file, which is kinda strange. Checking for url and skipping it if it's a url would probably solve this issue.

@DeMoorJasper DeMoorJasper mentioned this issue Dec 6, 2018
Closed
@dandv dandv mentioned this issue Dec 8, 2018
Closed
3 tasks
@DeMoorJasper DeMoorJasper mentioned this issue Dec 9, 2018
Merged
3 tasks
dandv referenced this issue Dec 11, 2018
@DeMoorJasper @devongovett
don't process external imports (#2380)
7a540fc
@dandv
Copy link
Contributor Author

dandv commented Dec 11, 2018 •
edited
Loading

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

image

@dandv dandv mentioned this issue Dec 16, 2018
Closed
@f3l1x
Copy link

f3l1x commented Feb 16, 2020

Hi guys. I run into the same error. I hope it will be solved in Parcel 2.

Trying to import module from CDN.

import Vue from "https://cdn.pika.dev/vue";

@mischnic mischnic mentioned this issue Feb 16, 2020
Open
@MaffooBristol
Copy link

@f3l1x you have to use the import() syntax not import from. It's kinda weird. I think the first one is Parcel-specific because eslint shouts at me when I do it...

@cekvenich2
Copy link

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

@ChristophP
Copy link
Contributor

I found this #7064 (comment)

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
🐛 Bug Good First Issue
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

Skip external import's from processing parcel-bundler/parcel
6 participants
@dandv @f3l1x @DeMoorJasper @MaffooBristol @ChristophP @cekvenich2