Dockerize Local Bedrock & Sage Development with Lando

@Jack_Kudla

Hi Jack,

I’d like to help you out more with this–but, I need more details from you.

Getting a 404 error might mean either of the following:

  1. A service like Apache may be running on your computer which is interfering with Lando.
  2. There is a permissions issue with the WordPress file your are trying to visit in your web browser. For example, if you are visiting the home page, the index.php file may have bad permissions.
  3. (More unlikely) Your computer may have had problems binding the example.local URL to your computer’s localhost.

I would try @Davide_Prevosto’s steps above. It may fix your issue.

Otherwise, if you feel comfortable doing so, maybe we could screenshare via Discord and troubleshoot this together?


Note: This issue is probably an issue with YOUR computer/setup–not the steps above. This is because other people tried my steps and verified they are working.

If you want to use an external MySQL tool like Sequel Ace, change the .lando.yml like this.

  1. remove the database directive from config.

  2. add the following under services

services:
  database:
    type: mariadb:10.6
    portforward: 33061   # port for external app access

I am tying to recover an older Bedrock project (1.10.2). I followed the recommended lando.yml setup.

name: marmalade
recipe: wordpress
env_file:
  - .env
proxy:
  appserver_nginx:
    - marmalade.lndo.site
  theme:
    - localhost:3000
config:
  composer_version: 2-latest
  php: '7.2'
  via: nginx
  webroot: web
  database: mariadb
  xdebug: true
services:
  theme:
    type: node:10.15.0
    overrides:
        ports:
          - 3000:3000
  ruby:
    type: ruby:2.4
    install_dependencies_as_me:
      - gem install capistrano
      - gem install capistrano-composer
      - gem install capistrano-wpcli
      - gem install bedrock-capistrano-uploads
      - gem install capistrano-file-permissions
tooling:
  yarn:
    service: theme
  gem:
    service: ruby
  ruby:
    service: ruby
  sshKey:
    service: ruby
    cmd:
      - cat /etc/ssh/ssh_config
  database:
    portforward: 3306

.ENV

DB_NAME=wordpress
DB_USER=wordpress
DB_PASSWORD=wordpress

# Optional variables
DB_HOST=localhost
DB_PREFIX=msbi_

WP_ENV=development
WP_HOME=http://test.lndo.site
WP_SITEURL=${WP_HOME}/wp

It seems the autoloader does not work correctly. I am keep getting an error on wordpress installation.

Warning: mysqli_real_connect(): (HY000/2002): No such file or directory in /app/web/wp/wp-includes/wp-db.php on line 1626

No such file or directory

Error establishing a database connection

This either means that the username and password information in your wp-config.php file is incorrect or we can’t contact the database server at localhost. This could mean your host’s database server is down.

  • Are you sure you have the correct username and password?
  • Are you sure you have typed the correct hostname?
  • Are you sure the database server is running?

If you’re unsure what these terms mean you should probably contact your host. If you still need help you can always visit the WordPress Support Forums.

Any idea why?

Cheers
Olaf

Now that Sage 10 officially rolled out - any suggestions on updating lando config?

One that’s probably worth noting:

+1 !
If someone can shere his lando config + bud config that would be wonderful !

So I spent a lot of time and reading trying to get this setup to work and I feel I am pretty close. But somehow I can’t get browsersync/localhost to work.

The problem:
After lando start the following url is red:
THEME URLS http://localhost

lando yarn dev seems to work fine, no errors and it notices changes I make etc.
But http:/localhost:3000 is not accessible (‘This site can’t be reached’)

Any help would be greatly appreciated!

My configuration:

.lando.yml

name: bedrock
recipe: wordpress
env_file:
  - .env
proxy:
  appserver_nginx:
    - bedrock.lndo.site 
  theme:
    - localhost:3000
    - localhost:3001
config:
  php: 7.4
  composer_version: 2-latest
  via: nginx
  webroot: web
  database: mariadb
  xdebug: true

# Add the following if you plan to use Sage as a starter theme
services:
  theme:
    type: node:16
    overrides:
      ports:
        - 3000:3000
        - 3001:3001

tooling:
  yarn:
    service: theme

excludes:
  - vendor
  - node_modules

.env

DB_NAME='wordpress'
DB_USER='wordpress'
DB_PASSWORD='wordpress'
DB_HOST='database'

WP_ENV='development'
WP_HOME='https://bedrock.lndo.site'
WP_SITEURL="${WP_HOME}/wp"

# Generate your keys here: https://roots.io/salts.html
# (I tried without salts but didn't make a difference, so I probably put them back here)

bud.config,js (identical to the latest Sage)

/**
 * @typedef {import('@roots/bud').Bud} bud
 *
 * @param {bud} app
 */
module.exports = async (app) => {
  app
    .entry({
      app: ['@scripts/app', '@styles/app'],
      editor: ['@scripts/editor', '@styles/editor'],
    })

    .assets('images')

    .watch('resources/views/**/*', 'app/**/*')

    .proxy('http://bedrock.lndo.site')

    .serve('http://localhost:3000');
};

I’ve also been fighting with this issue. I had a working lando + bedrock + sage config (basically the same as @cim posted above) that worked well while using mix and with bud 5.3.0. Once I updated to bud 5.5.0 I could not get bud dev to work properly.

When I use bud.serve(‘http://localhost:3000’) it runs but I get no response from localhost:3000 and the ‘[dev]’ and ‘[proxy]’ urls in the terminal show as grey. When I use bud.serve(‘http://bedrock.lndo.site:3000’) i get the error:

Error: listen EADDRNOTAVAIL: address not available 172.19.0.5:3000

If I remove bud.serve(), it succeeds using a random port which I also can’t access.

Yep same problem for me inside my own docker image for compiling assets.

Some more info…
Reverting to bud 5.4.0 lets me load http://localhost:3000 and http://bedrock.lndo.site:3000, but hot reloading is broken. I get a CORS error

Access to fetch at 'http://bedrock.lndo.site/app/themes/sage/public/app.afb458e755e818e47fec.hot-update.json' from origin 'http://bedrock.lndo.site:3000' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

I can confirm that reverting back to Sage 10 beta 3 (with bud 5.3.2) fixes hot reloading for me.

Maybe this bug in bud has something to do with it?

I’m using Lando (Docker wrapper) and I have exposed the port 3000 for node. But if I remove the .serve() line, i cant use the generated localhost:xxxx as this port hasn’t been exposed in docker and site using localhost:xxxx is unreachable.

If i instead use

.serve('http://localhost:3000');

and run lando yarn dev, the site is still unreachable at http://localhost:3000’;

I can however always reach the site at the domain ie http://example.test/

So my understanding is since I am using Docker, I have to remove the serve() line, but I also need to find a way to expose any random generated port on localhost through docker?

I’ve been trying to troubleshoot this all week. I’m not sure if it’s a Bud issue or Lando. My lando file looks like this, but I’ve also tried a separate sub domain for the theme proxy, with and without a specific port.

proxy:
  appserver:
    - sage.lndo.site
  theme:
    - localhost:3000
config:
  php: '7.4'
  composer_version: 2-latest
  webroot: web
services:
  theme:
    type: node:16
    overrides:
      ports:
        - 3000

When i visit http://localhost:3000 directly or curl -I 'http://localhost:3000 i get ’ Empty reply from server’, but if I lando ssh -s theme and then run the same curl command, I get the expected response:

HTTP/1.1 200 OK
content-type: text/html; charset=UTF-8
date: Thu, 17 Mar 2022 16:09:15 GMT
link: <https://sage.lndo.site/wp-json/>; rel="https://api.w.org/", <https://sage.lndo.site/wp-json/wp/v2/pages/23>; rel="alternate"; type="application/json", <https://sage.lndo.site/>; rel=shortlink
server: Apache/2.4.52 (Debian)
x-powered-by: PHP/7.4.28
connection: close
x-proxy-by: @roots/bud
x-bud-proxy-origin: https://sage.lndo.site
x-bud-dev-origin: http://localhost:3000
content-length: 0

It seems, for some reason, that requests are being properly directed to the theme container, or are somehow being modified, but I can’t track down why.

Also, when i specify the same domain in bud.serve as in proxy, i get the error Error: listen EADDRNOTAVAIL: address not available 172.19.0.2:3000

@noahott Yeah I have the exact same issue. I also installed a fresh Sage 10.1.2 just released a few hours ago, still same issue.

@noahott Have you had any luck getting this working on your end?

No, I’m still stuck on this one. Not really sure what the next troubleshooting steps are, but happy to help if you have any ideas. I’ve settled on using v5.3.2 for now.

No luck here either. Working with Trellis now. But I’m keeping an eye on this bug report that was recently added and is probably related to our problem.

The random port designation issue is fixed as of 5.7.0 (but you should install 5.7.3 if you’re giving it a go now).

Hi @kellymears, I’m still having the same issue with bud and Lando, even with version 5.7.3. I’ve tried specifying ports 3000, 3030, and 31234 all with the same results. I can SSH into the container running bud and receive the proper response there, but from outside the container I always get an “Empty reply from server.”

Hey y’all, I’m gonna close out this topic.

  1. This is an old guide that is not up-to-date with the current state of Sage
  2. These replies give the impression that there is an issue with Bud

This is just a matter of configuring Lando correctly. There is not anything in either Bud or Lando that are preventing the tools from working with each other. We are using Lando with Bud on two different internal projects at Roots: one with Sage, one with Laravel.

We’d love either an update to this guide or a new one. If you’re interested in contributing and getting paid to write, please see Write for Roots


:information_source: The Sage 10 + Lando discussion is continued at Lando + Bud/Sage Configuration