Skip to content

Overnormalize the format when Head component prints script tags. #36

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
Closed
masataka opened this issue Nov 17, 2020 · 1 comment · Fixed by #38
Closed

Overnormalize the format when Head component prints script tags. #36

masataka opened this issue Nov 17, 2020 · 1 comment · Fixed by #38
Labels
✘ bug Something isn't working

Comments

@masataka
Copy link

masataka commented Nov 17, 2020 •
edited
Loading

When importing an external script such as JQuery, the script tag is written in the part surrounded by the head tag, but at that time Aleph.js is overnormalized and the browser cannot interpret the HTML.

export default function App({ Page, pageProps }: { Page: ComponentType<any>, pageProps: any }) {
    return (<>
        <Head>
            <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
        </Head>
        <Page {...pageProps} />
    </>);
}

Aleph prints a script tag like this.

 <script src="https://code.jquery.com/jquery-3.1.1.min.js" ssr />

This seems correct, but it's actually HTML that the browser can't draw as intended. we need a below.

 <script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>

There is a workaround. I wrote a JavaScript comment into the script tag's body.

export default function App({ Page, pageProps }: { Page: ComponentType<any>, pageProps: any }) {
    return (<>
        <Head>
            <script src="https://code.jquery.com/jquery-3.1.1.min.js">/* WRITE JS COMMENT HERE */</script>
        </Head>
        <Page {...pageProps} />
    </>);
}
@ije ije added the ✘ bug Something isn't working label Nov 18, 2020
@ije ije mentioned this issue Nov 18, 2020
Merged
@ije ije closed this as completed in #38 Nov 18, 2020
@ije
Copy link
Member

ije commented Nov 18, 2020

@masataka just fixed it, thanks

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
✘ bug Something isn't working
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

fix: fix head scripts prints alephjs/aleph.js
2 participants
@ije @masataka