Péter Teszáry


WordPress Development Environment on Pop OS

WordPress Development Environment on Pop OS

WordPress BoilerPlate Chase part 2.

Péter Teszáry's photo
Péter Teszáry
·Feb 13, 2022·

6 min read

The devil is in the small details...

So reflecting on my previous article (WordPress Boiler Plate Chase), I might find some solution to it. Also, it has a short story, that has happened this weekend.

So previously I've started to breathe life into Sage's boilerplate, with no luck. I thought it was some specialized dependency problem, that was caused by Pop OS. So I decided to look into a different way for no, cause I want to make some progress. I'll get back to is when I am feeling comfortable with packages and dependencies like composer and node.

VS Code extensions are not working

I found a Tailwind boilerplate which looks good, and it was easy to install (I thought). BUT. Then I've wanted to install the Tailwind CSS Intellisense extension to my VS Code, because I am a bit lazy with remembering CSS classes, so it might help. I am using Tailwind with my WordPress projects, and I really like it, but it is easier to cheat a bit with a classes-helper like that.

Ao after the installation an error message came up.

Tailwind CSS: Can't resolve 'lodash' in ....

Or something like that. I've tried to get it back from my browser history, but It was just too many records. Anyways, I could not find the answer. But. I thought that might be a problem with Pop Os again. I've tried to uninstall, and reinstall Nodejs & npm again. Auto removes, purge and clear everything with an auto fix as well. Nothing worked. So I thought I will install the good old Ubuntu on my laptop again (the problems above were on my desktop PC).

I have installed ubuntu beside my Pop Os, cause I did not want to go through the install processes of each Os week after week. I have installed 20.04 of Ubuntu, unfortunately. I did not check the version on the bootable Pendrive. So I had to upgrade after installation.

Years passed while the terminal was updating the stuff. I decided to watch the Shang-Chi movie, and come back in the morning. In the morning everything was fine. I have installed Nodejs and npm. I have installed Local by Flywheel (as I told you I am lazy) and VS code (and also some Ubuntu tweaks). Fresh WordPress install with the TailPress theme/repo in it. Great. Almost everything is green. Even the npm watch is working!!!

Then I wanted to install Tailwind CSS Intellisense with this fresh installation. Same error as previously. I made a coffee.

So the problem might not be with Ubuntu or Pop Os either. After some investigation, I have found the right solution with the right installation methods. I will create a Shell script later on and update the post with it.

First of all, you have to clear all that you (probably) have done, to solve the problem.



sudo apt clean
sudo apt update -m
sudo dpkg --configure -a
sudo apt install -f
sudo apt full-upgrade
sudo apt autoremove --purge


sudo apt install pop-desktop

Removing Nodejs and Npm


sudo apt-get remove nodejs npm node
sudo apt-get purge nodejs

Now remove .node and .npm folders from your system

sudo rm -rf /usr/local/bin/npm 
sudo rm -rf /usr/local/share/man/man1/node* 
sudo rm -rf /usr/local/lib/dtrace/node.d 
sudo rm -rf ~/.npm 
sudo rm -rf ~/.node-gyp 
sudo rm -rf /opt/local/bin/node 
sudo rm -rf opt/local/include/node 
sudo rm -rf /opt/local/lib/node_modules  

sudo rm -rf /usr/local/lib/node*
sudo rm -rf /usr/local/include/node*
sudo rm -rf /usr/local/bin/node*

Go to home directory and remove any node or node_modules directory, if exists.

You can verify your uninstallation by these commands; they should not output anything.

which node
which nodejs
which npm

And now, start it over, but first of all with Composer


So, not from VS Code's terminal in the theme folder of your WordPress theme

Like this


Installing PHP and Additional Dependencies

First, update the package manager cache by running

sudo apt update

Next, run the following command to install the required packages:

sudo apt install php-cli unzip

Downloading and Installing Composer

cd ~
curl -sS https://getcomposer.org/installer -o /tmp/composer-setup.php

Next, we’ll verify that the downloaded installer matches the SHA-384 hash for the latest installer found on the Composer Public Keys / Signatures page. To facilitate the verification step, you can use the following command to programmatically obtain the latest hash from the Composer page and store it in a shell variable:

HASH=`curl -sS https://composer.github.io/installer.sig`

If you want to verify the obtained value, you can run:

echo $HASH

Now execute the following PHP code, as provided in the Composer download page, to verify that the installation script is safe to run:

php -r "if (hash_file('SHA384', '/tmp/composer-setup.php') === '$HASH') { echo 'Installer verified'; } else { echo 'Installer corrupt'; unlink('composer-setup.php'); } echo PHP_EOL;"

You’ll see the following output:

Installer verified

To install composer globally, use the following command which will download and install Composer as a system-wide command named composer, under /usr/local/bin:

sudo php /tmp/composer-setup.php --install-dir=/usr/local/bin --filename=composer

You’ll see output similar to this:

All settings correct for using Composer

Composer (version 1.10.5) successfully installed to: /usr/local/bin/composer
Use it: php /usr/local/bin/composer

To test your installation, run:



  / ____/___  ____ ___  ____  ____  ________  _____
 / /   / __ \/ __ `__ \/ __ \/ __ \/ ___/ _ \/ ___/
/ /___/ /_/ / / / / / / /_/ / /_/ (__  )  __/ /
\____/\____/_/ /_/ /_/ .___/\____/____/\___/_/
Composer version 1.10.5 2020-04-10 11:44:22

  command [options] [arguments]

  -h, --help                     Display this help message
  -q, --quiet                    Do not output any message
  -V, --version                  Display this application version
      --ansi                     Force ANSI output
      --no-ansi                  Disable ANSI output
  -n, --no-interaction           Do not ask any interactive question
      --profile                  Display timing and memory usage information
      --no-plugins               Whether to disable plugins.
  -d, --working-dir=WORKING-DIR  If specified, use the given directory as working directory.
      --no-cache                 Prevent use of the cache
  -v|vv|vvv, --verbose           Increase the verbosity of messages: 1 for normal output, 2 for more verbose output and 3 for debug

Then install Nodejs & npm


Start by updating the packages list by typing:

sudo apt update

Install nodejs using the apt package manager:

sudo apt install nodejs npm

To launch:


To verify:

node -v && npm -v

Then you can install the Tailwind boilerplate into your WordPress theme folder:


Open the themes folder in VS Code (where all your themes are NOT the exact theme order (in case it does not exist yet))

Open a terminal in VS Code

composer global require jeffreyvanrossum/tailpress-installer

Clone repo

git clone https://github.com/jeffreyvr/tailpress.git && cd tailpress


rm -rf .git


npm install


npm run watch

to start developing

And now you can use Tailwind CSS Intellisense...

Hope it helps!

Comment if it is! :)

Good Luck!

If there is something wrong, don't hesitate to comment it under, so I can correct my article. Thanks!

Share this