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

Cannot use import from outside a module #11548

Closed
breuerfelix opened this issue May 12, 2020 · 3 comments
Closed

Cannot use import from outside a module #11548

breuerfelix opened this issue May 12, 2020 · 3 comments
Labels
i: bug i: needs triage outdated A closed issue/PR that is archived due to age. Recommended to make a new issue

Comments

@breuerfelix
Copy link

Bug Report

Current Behavior
Babel is not able to resolve the import statement as the native Browser.

Code setup:

// index.js
import message from './message.js';
document.getElementById('output').innerHTML = message;
// message.js
const message = "hello world";
export default message;

Working example without Babel:

<!DOCTYPE html>
<html>
  <head></head>
  <body>
    <div id="output"></div>
    <script src="index.js" type="module"></script>
  </body>
</html>

Example with Babel which is not working:

<!DOCTYPE html>
<html>
  <head></head>
  <body>
    <div id="output"></div>
    <script src="https://unpkg.com/@babel/standalone/babel.min.js"></script>
    <script src="index.js" type="text/babel" data-type="module" data-presets=""></script>
  </body>
</html>

Babel throws the following error:

Cannot use import from outside a module

If i don't set the data-presets attribute, I get an error that require is not defined.

Am i missing something or is this a Bug ?

Why do i wanna get this going?
If this will work you could set data-presets to "typescript" and call your typescript files "*.ts.js". Then you would be able to prototype Typescript and also split your code into different files without having to setup a bundler or ANYTHING.

To me, this is the sexiest and minimalist setup i could imagine.
@babel-bot
Copy link
Collaborator

Hey @breuerfelix! We really appreciate you taking the time to report an issue. The collaborators on this project attempt to help as many people as possible, but we're a limited number of volunteers, so it's possible this won't be addressed swiftly.

If you need any help, or just have general Babel or JavaScript questions, we have a vibrant Slack community that typically always has someone willing to help. You can sign-up here for an invite."

@JLHwung
Copy link
Contributor

JLHwung commented May 12, 2020

In #11466 we support data-type annotation in @babel/standalone, it will be shipped in the next minor release 7.10.

Since there is an ongoing PR targeting to this issue, I am gonna close it. @breuerfelix Thanks for the report.

@JLHwung JLHwung closed this as completed May 12, 2020
@breuerfelix
Copy link
Author

@JLHwung hmm somehow i already read about that setting in another issue that it is possible :D

thanks alot for this info ! then i just have to wait some days, hope it will be soon since daaaamn a world without a bundler (even though a little slower) would be awesome :D

@github-actions github-actions bot added the outdated A closed issue/PR that is archived due to age. Recommended to make a new issue label Aug 12, 2020
@github-actions github-actions bot locked as resolved and limited conversation to collaborators Aug 12, 2020
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Assignees
No one assigned
Labels
i: bug i: needs triage outdated A closed issue/PR that is archived due to age. Recommended to make a new issue
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
3 participants
@JLHwung @babel-bot @breuerfelix