Magento PWA Docs for overwrite a component such as Footer is found here:https://magento.github.io/pwa-studio/tutorials/pwa-studio-fundamentals/modify-site-footer/

So I'm assuming the same steps should be taken to overwrite any other component such as Logo:

What've done ins my pwa-custom project!

in my project folder pwa-custom

mkdir -p src/components/Logo

cp node_modules/@magento/venia-ui/lib/components/Logo/logo.js src/components/Logo

For testing I've edited logo.js and added console.log('here');

Create a src/components/Logo/index.js file with the following content to set the default component export for the Logo directory.

export {default} from './logo'

on yarn run watch no changes or compilation activates.

Does anyone have any idea what I'm doing wrong or missing?

1 Answer 1


Not so simple. One cannot overwrite Logo without first overwriting Header component:


return (
        <main className={rootClass}>
            <Header /> //Header imports Logo hence it need Header first!
            <div className={pageClass}>{children}</div>
            <Footer />

Same process to Overwrite Footer to follow for Header once Header has been overwritten the Logo overwrite will work!


Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Not the answer you're looking for? Browse other questions tagged or ask your own question.