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

Improve Vue appEntrypoint handling #8794

Merged
merged 15 commits into from
Dec 5, 2023

Conversation

yoyo837
Copy link
Contributor

@yoyo837 yoyo837 commented Oct 10, 2023

Changes

Improve robustness and compatibility for some case.

When vue's appEntrypoint is configured and it does not return the default function, it will throw an error:

astro.config.mjs:

  integrations: [
    vue({
      appEntrypoint: '/src/pages/_app',
      template: {
        compilerOptions: {
          //
        },
      },
    }),
  ],

src/app.js:

// Comment it out, so no export default function
// export default async app => {
//   await global(app);
// };

An error will be thrown after running:

image

Testing

Check if a function is available before calling it.

Docs

@changeset-bot
Copy link

changeset-bot bot commented Oct 10, 2023

🦋 Changeset detected

Latest commit: 2500fdc

The changes in this PR will be included in the next version bump.

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@github-actions github-actions bot added pkg: vue Related to Vue (scope) pkg: integration Related to any renderer integration (scope) labels Oct 10, 2023
Copy link
Member

@natemoo-re natemoo-re left a comment

Choose a reason for hiding this comment

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

Code looks fine, would like to know why we need this though!

.changeset/smart-cameras-kneel.md Outdated Show resolved Hide resolved
'@astrojs/vue': major
---

chore: improve app setup call
Copy link
Member

Choose a reason for hiding this comment

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

This is pretty non-descriptive and I don't have any info to go off of in the PR description. Would you mind describing specifically why you made these changes?

Copy link
Contributor Author

@yoyo837 yoyo837 Oct 12, 2023

Choose a reason for hiding this comment

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

Yes.

astro.config.mjs:

  integrations: [
    vue({
      appEntrypoint: '/src/pages/_app',
      template: {
        compilerOptions: {
          //
        },
      },
    }),
  ],

In the /src/pages/_app.js file, if there is no export defualt (app) => {}, it may cause errors.

Copy link
Member

@ematipico ematipico left a comment

Choose a reason for hiding this comment

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

Blocking, for the following reasons:

  • the template is empty and doesn't explain anything about the PR
  • we don't know what we are fixing, there isn't a test
  • there's no test nor explanation about this fix being tested

@yoyo837
Copy link
Contributor Author

yoyo837 commented Oct 13, 2023

Blocking, for the following reasons:

  • the template is empty and doesn't explain anything about the PR
  • we don't know what we are fixing, there isn't a test
  • there's no test nor explanation about this fix being tested

There is my first astro PR. Is there any documentation on how to create a standard PR?

@ematipico
Copy link
Member

ematipico commented Oct 13, 2023

Blocking, for the following reasons:

  • the template is empty and doesn't explain anything about the PR
  • we don't know what we are fixing, there isn't a test
  • there's no test nor explanation about this fix being tested

There is my first astro PR. Is there any documentation on how to create a standard PR?

Edit the description of the PR. Under Changes explain what this change is about, you gave a great explanation to Nate before, you can do the same in the PR. Explain the bug and how you fixed that.

Under the Testing explain how you tested your fix. Ideally, you should create a new test inside the integration.

No need for documentation, so you can leave that part empty.

@yoyo837
Copy link
Contributor Author

yoyo837 commented Oct 13, 2023

Thanks. I'll try it later.

@ematipico
Copy link
Member

Hi @yoyo837 , are you still interested in this PR?

@yoyo837
Copy link
Contributor Author

yoyo837 commented Oct 30, 2023

Hi @yoyo837 , are you still interested in this PR?

Yes, I still want to finish this PR, but I also wouldn't mind opening a new PR when I actually do it.

@yoyo837 yoyo837 force-pushed the fix-app-no-default-export-fn branch from ac6566c to d4e62fa Compare October 31, 2023 01:18
@github-actions github-actions bot added the pr: docs A PR that includes documentation for review label Oct 31, 2023
@yoyo837
Copy link
Contributor Author

yoyo837 commented Oct 31, 2023

When I add the test case, I got some error:

RollupError: "default" is not exported by "test/fixtures/app-entrypoint-no-export-default/src/pages/_app.ts", imported by "virtual:@astrojs/vue/app".

it seems that Rollup does not allow no export default declaration.

https://rollupjs.org/troubleshooting/#error-name-is-not-exported-by-module

@ematipico
Copy link
Member

I think the error is correct. Maybe what you want to do is to use import * as virtualApp instead

@yoyo837
Copy link
Contributor Author

yoyo837 commented Oct 31, 2023

I think the error is correct. Maybe what you want to do is to use import * as virtualApp instead

Need help.

@ematipico
Copy link
Member

I am not very familiar with the integration, but that is failing because in case of appEntrypoint, we don't export a default export

if (id === resolvedVirtualModuleId) {
if (options?.appEntrypoint) {
return `export { default as setup } from "${options.appEntrypoint}";`;
}
return `export const setup = () => {};`;

@florian-lefebvre florian-lefebvre changed the title chore: improve app setup call feat: prevents Astro from crashing when no default function is exported from the appEntrypoint Dec 4, 2023
@natemoo-re natemoo-re force-pushed the fix-app-no-default-export-fn branch from 8bdb895 to b2e3698 Compare December 4, 2023 20:46
Copy link
Member

@natemoo-re natemoo-re left a comment

Choose a reason for hiding this comment

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

Thanks for picking this up again @florian-lefebvre! Just pushed some changes but this LGTM.

packages/integrations/vue/src/index.ts Show resolved Hide resolved
packages/integrations/vue/src/index.ts Show resolved Hide resolved
packages/integrations/vue/src/index.ts Show resolved Hide resolved
@natemoo-re natemoo-re changed the title feat: prevents Astro from crashing when no default function is exported from the appEntrypoint Improve Vue appEntrypoint handling Dec 5, 2023
@natemoo-re natemoo-re merged commit 4d4e34d into withastro:main Dec 5, 2023
13 checks passed
@astrobot-houston astrobot-houston mentioned this pull request Dec 5, 2023
@natemoo-re natemoo-re mentioned this pull request Dec 5, 2023
1 task
@yoyo837
Copy link
Contributor Author

yoyo837 commented Dec 6, 2023

Thank you everyone for making this PR landed.

@yoyo837 yoyo837 deleted the fix-app-no-default-export-fn branch December 6, 2023 03:28
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
pkg: integration Related to any renderer integration (scope) pkg: vue Related to Vue (scope) pr: docs A PR that includes documentation for review
Projects
None yet
Development

Successfully merging this pull request may close these issues.

5 participants