React-helmet: overrideHead={Boolean(true)}

Created on 10 Jan 2017 · 6Comments · Source: nfl/react-helmet

Is there any way to clean inside head(anything inside of it)?
Would be cool if there could be a prop overrideHead={Boolean(true)}...

Source

ozluy

Most helpful comment

Thank you @cwelch5,
Adding changes(adding data-react-helmet="true" to link tag) in my __index.html__ solved issue like below...

<!doctype html>
<html lang="tr-TR">
    <head>
        <link rel="stylesheet" href="../static/styles/loading.min.css" data-react-helmet="true">
    </head>
    <body>
        <div id="root"></div>
        <script src="/bundle.js"></script>
    </body>
</html>

ozluy on 17 Jan 2017

👍5 🎉1

All 6 comments

Are you trying to override a particular tag, or the whole head? Maybe an example would help.

cwelch5 on 16 Jan 2017

Hi @cwelch5, the thing I want actually remove a style link not actually override it or clean inside of head tag.

ozluy on 16 Jan 2017

You can clear out styles like so:

                ReactDOM.render(
                    <Helmet
                        link={[
                            {"href": "http://localhost/helmet", "rel": "stylesheet"}
                        ]}
                    />,
                    container
                );

                ReactDOM.render(
                    <Helmet
                        meta={[
                            {name: "description", "content": "test"}
                        ]}
                        link={[]}
                    />,
                    container
                );

Of course that clears out all styles. Will that satisfy your use case?

cwelch5 on 16 Jan 2017

what I am trying is; removing __loading.min.css__ from __index.html__ file with React Helmet after my bundle.js loaded.

<!doctype html>
<html lang="tr-TR">
    <head>
        <link rel="stylesheet" href="../static/styles/loading.min.css">
    </head>
    <body>
        <div id="root"></div>
        <script src="/bundle.js"></script>
    </body>
</html>

ozluy on 16 Jan 2017

ah, so currently you can't manipulate tags that aren't managed within Helmet. All tags generated and managed within Helmet have an attribute on the tag like so: data-react-helmet=true

If you aren't server side rendering, I suppose you could manually add this attribute to the tag to then clear using the solution I posted previously.

cwelch5 on 17 Jan 2017

🎉1 👍1

Thank you @cwelch5,
Adding changes(adding data-react-helmet="true" to link tag) in my __index.html__ solved issue like below...

<!doctype html>
<html lang="tr-TR">
    <head>
        <link rel="stylesheet" href="../static/styles/loading.min.css" data-react-helmet="true">
    </head>
    <body>
        <div id="root"></div>
        <script src="/bundle.js"></script>
    </body>
</html>

ozluy on 17 Jan 2017

👍5 🎉1

Was this page helpful?

0 / 5 - 0 ratings