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.

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

Remove "imports on top" warning #1001

Merged
merged 3 commits into from
Jul 21, 2022
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
1 change: 0 additions & 1 deletion src/pages/en/core-concepts/astro-components.md
Original file line number Diff line number Diff line change
Expand Up @@ -55,7 +55,6 @@ You can use the component script to write any JavaScript code that you need to r

```astro
---
// Note: Imports must live at the top of your file.
import SomeAstroComponent from '../components/SomeAstroComponent.astro';
import SomeReactComponent from '../components/SomeReactComponent.jsx';
import someData from '../data/pokemon.json';
Expand Down
4 changes: 0 additions & 4 deletions src/pages/en/core-concepts/framework-components.md
Original file line number Diff line number Diff line change
Expand Up @@ -58,10 +58,6 @@ import MyReactComponent from '../components/MyReactComponent.jsx';
</html>
```

:::tip
Remember: all imports must live at the **top** of your Astro component script!
:::

By default, your framework components will render as static HTML. This is useful for templating components that are not interactive and avoids sending any unnecessary JavaScript to the client.

## Hydrating Interactive Components
Expand Down
11 changes: 0 additions & 11 deletions src/pages/en/guides/troubleshooting.md
Original file line number Diff line number Diff line change
Expand Up @@ -11,17 +11,6 @@ Astro provides several different tools to help you troubleshoot and debug your c

Here are some common error messages you might see in the terminal, what they might mean, and what to do about them.

### Transform failed with X error

This message often appears due to a current limitation in Astro requiring your import and export statements to be at the top of your `.astro` file.

**Solution**: Write your imports and exports at the top of your component script.

**Status**: Current limitation; fix is being worked on.

**Not sure that this is your problem?**
Check to see if anyone else has reported [this issue](https://github.com/withastro/astro/issues?q=is%3Aissue+is%3Aopen+Transform+failed+with+*+error)!

Comment on lines -14 to -24
Copy link
Member Author

@natemoo-re natemoo-re Jul 21, 2022

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Removed this since it's no longer relevant, nor is the Unexpected export error that I originally replaced it with.

withastro/astro#4003 will provide helpful hints in-context if a user does run into an error due to export hoisting

Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Aww... bye bye TOP NUMBER ONE ERROR. 🥲

### Cannot use import statement outside a module

In Astro components, `<script>` tags are hoisted and loaded as [JS modules](https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Modules) by default. If you have included the [`is:inline` directive](/en/reference/directives-reference/#isinline) or any other attribute in your tag, this default behavior is removed.
Expand Down