Local development tips and tricks for Shopware 6

  • January 1, 1

Local development tips and tricks for Shopware 6

We’ve collected a list of useful tips and tricks for optimizing and/or using your local development environment for professional Shopware 6 development:

Fix missing images inside your local environment

You can download (and/or sync) all images from the production server but in most cases you don’t want to. You can just tell Shopware to prepend the url of the production environment. All images will be visible and you don’t have to download them manually:

config/packages/dev/shopware.yaml

shopware:
    filesystem:
        public:
            type: "local"
            url: "https://www.example.com/" # Replace with correct url
            config:
                root: "%kernel.project_dir%/public"

Devcontainers

Useful features

[]
"features": {
        "ghcr.io/devcontainers/features/sshd:1": {},
        "ghcr.io/rocker-org/devcontainer-features/apt-packages:1": {
            "packages": [
                "vim",
                "curl"
            ]
        },
        "ghcr.io/devcontainers/features/docker-in-docker:2": {
            "moby": true,
            "azureDnsAutoDetection": true,
            "installDockerBuildx": true,
            "installDockerComposeSwitch": true,
            "version": "latest",
            "dockerDashComposeVersion": "latest"
        },
        "ghcr.io/devcontainers/features/common-utils:2": {
            "installZsh": true,
            "configureZshAsDefaultShell": true,
            "installOhMyZsh": true
        },
        "ghcr.io/devcontainers/features/github-cli:1": {},
        "ghcr.io/devcontainers-contrib/features/pre-commit:2": {},
        "ghcr.io/devcontainers/features/node:1": {
            "version": "16"
        },
        "ghcr.io/shyim/devcontainers-features/shopware-cli:0": {},
        "ghcr.io/nils-geistmann/devcontainers-features/zsh:0": {
            "setLocale": true,
            "theme": "agnoster",
            "plugins": "ansible colorize dirhistory gh git docker docker-compose",
            "desiredLocale": "de_DE.UTF-8 UTF-8"
        }
    },
[]

Useful extensions

"customizations": {
    "vscode": {
        "extensions": [
            "GitHub.copilot",
            "GitHub.vscode-pull-request-github",
            "GitHub.vscode-github-actions",
            "xdebug.php-debug",
            "DEVSENSE.phptools-vscode",
            "DEVSENSE.composer-php-vscode",
            "elagil.pre-commit-helper",
            "esbenp.prettier-vscode",
            "redhat.vscode-yaml",
            "redhat.vscode-xml",
            "DavidAnson.vscode-markdownlint",
            "sibiraj-s.vscode-scss-formatter",
            "mikestead.dotenv",
            "EditorConfig.EditorConfig",
            "marabesi.php-import-checker",
            "fabiospampinato.vscode-statusbar-debugger",
            "formulahendry.auto-close-tag",
            "formulahendry.auto-rename-tag",
            "ms-vsliveshare.vsliveshare",
            "whatwedo.twig",
            "cweijan.vscode-mysql-client2",
            "ms-azuretools.vscode-docker"
        ]
    }
},

Connecting with Devcontainer over SSH

First of all you have to ensure that this feature ghcr.io/devcontainers/features/sshd:1 is included in the features-section in .devcontainer/devcontainer.json. Then you have to set the password for the vscode user. Open the terminal inside of your Devcontainer and execute this command to (re)set the password to password without interaction:

printf "password\npassword" | sudo passwd ${whoami}

Then you can connect via SSH outside your Devcontainer:

ssh vscode@localhost -p2222

In this example we assume that you use the default user vscode inside your Devcontainer. If you have multiple Devcontainers then the port can differ.

Pushing commits to github.com inside Devcontainer

  1. Create a new folder sudo mkdir -vp /home/${USER:-vscode}/.ssh
  2. Set correct permissions with sudo chown -R ${USER:-vscode}:${USER:-vscode} /home/${USER:-vscode}/.ssh
  3. Create a config file inside the new folder with touch /home/${USER:-vscode}/.ssh/config and then add these lines into it:
Host github.com
Hostname ssh.github.com
User git
Port 22
PreferredAuthentications publickey
IdentityFile ~/.ssh/id_rsa
StrictHostKeyChecking no
UserKnownHostsFile /dev/null
  1. The SSH key pairs are not yet available inside the Devcontainer. You have two options:

    • a) You can create new key pairs with with ssh-keygen
    • b) (recommended) You can just mount your existing key pairs inside the container. All you have to do is to add a new section in .devcontainer/devcontainer.json and then rebuild your Devcontainer:
"mounts": [
    "source=${localEnv:HOME}/.ssh/id_rsa,target=/home/vscode/.ssh/id_rsa,type=bind,consistency=cached,readonly",
    "source=${localEnv:HOME}/.ssh/id_rsa.pub,target=/home/vscode/.ssh/id_rsa.pub,type=bind,consistency=cached,readonly"
]

Running Shopware behind a reverse proxy

In some cases you want to run a reverse proxy (e.g. Traefik) in front of your Shopware environments. Add this environment variable to your .env or .env.local to allow internal traffic over http:// instead of https:// so you don’t have to do ssl termination:

TRUSTED_PROXIES=127.0.0.1,REMOTE_ADDR
comments powered by Disqus

Related Posts

How to build an Application with modern Technology

How to build an Application with modern Technology

Nemo vel ad consectetur namut rutrum ex, venenatis sollicitudin urna. Aliquam erat volutpat. Integer eu ipsum sem. Ut bibendum lacus vestibulum maximus suscipit. Quisque vitae nibh iaculis neque blandit euismod.

Read More
How to build an Application with modern Technology

How to build an Application with modern Technology

Nemo vel ad consectetur namut rutrum ex, venenatis sollicitudin urna. Aliquam erat volutpat. Integer eu ipsum sem. Ut bibendum lacus vestibulum maximus suscipit. Quisque vitae nibh iaculis neque blandit euismod.

Read More
How to build an Application with modern Technology

How to build an Application with modern Technology

Nemo vel ad consectetur namut rutrum ex, venenatis sollicitudin urna. Aliquam erat volutpat. Integer eu ipsum sem. Ut bibendum lacus vestibulum maximus suscipit. Quisque vitae nibh iaculis neque blandit euismod.

Read More