ScandiPWA (deprecated)
User ManualGitHubSlack
  • ScandiPWA (deprecated)
  • React & PWA for dummies
    • Setting Up Environment and Talking Theory
    • Learning React Hands-on
    • Styling It
    • Learning ScandiPWA Way
  • START & UPGRADE
    • Linux Docker setup
    • Mac Docker setup
    • Setting up the theme with remote M2 server
    • Theme Upgrade to the latest version
    • Automated setup (BETA)
  • A TO Z OVERVIEW
    • Motivation
    • Challenges
    • File structure and UI components
    • Rewriting and Extending A Theme
  • DESCRIPTION OF CONTAINERS
    • Ngrok
  • FAQ
    • Development
    • Installation
    • Billing and license
    • Product support
    • What is PWA?
  • HOW-TO TUTORIALS - INTRODUCTORY
    • Base template
    • Connecting to the GraphQL resolver
    • Extension mechanism
    • Creating GraphQL resolver
    • Debugging and Inspecting
    • Setting Up Frontend
    • File Structure
    • Data Flow
    • Technology Stack
    • Changing environment
    • Theme Build and Configuration
    • Implementing Caching for New Caching Identities
    • Implementing a parent theme
  • HOW-TO TUTORIALS - INTERMEDIATE
    • Debugging in Chrome
    • Configuring XDebug
    • CLI in Docker
    • Postman & GraphQL Playground
    • VSCode Extensions
    • Plugins: implementing
    • Plugins: using and publishing
    • ESlint & StyleLint
    • How To Contribute
    • Migrating to a Newer Version
    • Installation on Existing Magento 2 Sever
    • BEM and Coding Standards
    • Tools of ScandiPWA
    • React Best Practices
  • FAQ
    • Untitled
Powered by GitBook
On this page
  • Before you start
  • It is time to setup!
  • Time to open the site
  • Something does not work?
  1. HOW-TO TUTORIALS - INTERMEDIATE

Installation on Existing Magento 2 Sever

PreviousMigrating to a Newer VersionNextBEM and Coding Standards

Last updated 4 years ago

Before you start

  1. Make sure your server is running Magento 2.3.3, or 2.3.5. Version 2.3.4 is not supported.

  2. Make sure Redis is available on the host machine. Obtain the host, port of this service.

  3. Make sure you have node available on you machine. To test this, run:

node -v # should be 10^

4. Make sure the Varnish is installed on the host / infrastructure and Magento is configured to use it. Please validate with following:

varnishd -V # should be 5^

In Magento admin go to Stores > Configuration > Advanced > System > Full Page Cache. Make sure the Varnish Cache is selected in the dropdown, varnish configuration has proper values set in it.

Note:

varnish is important! Please validate if it is installed with your hosting provider / developer.

5. Make sure the Redis is installed on your host / infrastructure. To validate the installation run following:

redis-cli -v # should output 2.5^

Note:

steps 5. and 6. are the requirements of scandipwa/persisted-query package.

6. Important instance specific configurations:

  • Make sure your server is configured to point into <MAGENTO ROOT>/pub directory.

It is time to setup!

  1. Install scandipwa/installer using following command:

composer require scandipwa/installer

2. Configure scandipwa/persisted-query module, using Magento CLI:

Execute the CLI command for each configuration value as follows:

php bin/magento setup:config:set <FLAG> <VALUE>
  • --pq-host [mandatory] - persisted query redis host (redis for ScandiPWA docker setup, localhost in the most common custom setup case)

  • --pq-port [mandatory] - persisted query redis port (6379 for ScandiPWA docker setup)

  • --pq-database [mandatory] - persisted query redis database (5 for ScandiPWA docker setup)

  • --pq-scheme [mandatory] - persisted query redis scheme (set to tcp in not sure)

  • --pq-password [optional, empty password is not allowed] - persisted query redis password

Alternatively, set those configurations directly in app/etc/env.php under cache key:

'cache' => [
    'persisted-query' => [
        'redis' => [
            'host' => '<REDIS HOST>',
            'scheme' => 'tcp',
            'port' => '<REDIS PORT>',
            'database' => '5'
        ]
    ]
]

3. Install the ScandiPWA theme:

Note:

by default for <YOUR VENDOR>/<YOUR THEME> we are using Scandiweb/pwa. But you can choose any other one.

php bin/magento scandipwa:theme:bootstrap <YOUR VENDOR>/<YOUR THEME>

Note:

If the name is different from Scandiweb/pwa, edit the <THEME ROOT>/src/config/webpack.production.config.js configuration file. Specifically update the publicPath constant declaration to match <YOUR VENDOR>/<YOUR THEME>.

4. Go to the bootstrapped theme folder, and install the dependencies and compile a project:

cd app/design/frontend/<YOUR VENDOR>/<YOUR THEME>
npm ci # install dependencies
npm run build

5. Time to change Magento theme:

  1. For desired store, set the theme to <YOUR VENDOR>/<YOUR THEME>

Time to open the site

  1. Open your favorite browser, i.e. Google Chrome

  2. Open your server domain

Something does not work?

Upon immediate inspection theme could appear fine, but might not load at all. Please open you inspector and make sure the requests (at least one GET and one POST) has returned successfully. If they did, please checkout the rest for error fields in response. The most common issues are:

  1. Missing Header and Footer CMS blocks.

    To resolve, go to the admin panel, create at least one CMS block and one Scandiweb menu, then go to Store > Configuration > ScandiPWA > Content customization and select CMS blocks for all fields. If you will select the field to be “empty” it will also count as a selection.

Note:

after changing those configurations remember to flush the Magento caches.

For other issues, follow this simple algorithm:

Note:

the Docker setup related issues are also mentioned in this document.

In case this command resulted in error, install node using the . Prefer nvm installation to get NODE version 10 specifically.

If it is not, please follow to set it up.

If it is not installed, please follow to obtain it.

Follow to set a theme

Homepage not showing - refer to the , search for 404 on Homepage.

Refer to the . It most probably already has the solution to your problem.

If the issue still persists, , and feel free to ask questions in #pwa_tech public channel.

Alternatively - however, the response time there will be a little-bit longer than in community Slack.

official guide
official documentation
this guide
official guide
FAQ
FAQ page
join our community slack
create an issue on GitHub
Installation on Existing Magento 2 Sever