How to make a Installable Sage Wordpress Theme?

sage
1

I am building my own theme using the Sage WordPress theme template. I can build the development version of my theme, but I am unsure how to compress it into a usable .zip file for production.

I have tried 2018 ver solution but didn’t work; it made broken zip file.

Error: Composer could not detect the root package (roots/sage) version, defaulting to '1.0.0'. See https://getcomposer.org/root-version

Entire output:

Preparing my-theme...
Composer could not detect the root package (roots/sage) version, defaulting to '1.0.0'. See https://getcomposer.org/root-version
Installing dependencies from lock file
Verifying lock file contents can be installed on current platform.
Package operations: 0 installs, 0 updates, 1 removal
  - Removing laravel/pint (v1.16.0)
Generating optimized autoload files
46 packages you are using are looking for funding.
Use the `composer fund` command to find out more!
Not a git repository. Skipping commit hash generation.
Composer could not detect the root package (roots/sage) version, defaulting to '1.0.0'. See https://getcomposer.org/root-version
Installing dependencies from lock file (including require-dev)
Verifying lock file contents can be installed on current platform.
Package operations: 1 install, 0 updates, 0 removals
  - Installing laravel/pint (v1.16.0): Extracting archive
Generating optimized autoload files
46 packages you are using are looking for funding.
Use the `composer fund` command to find out more!
Finished!
my-theme $

I tried using a theme download plugin, and it works, but the resulting zip file was around 70MB because it included the node_modules folder.

I know there is a build command in package.json which creates a /public directory, but my question is: What exactly do I need to compress into a zip file for it to be a usable theme?

Here’s what my project directory looks like:

My folder structure image

2

To prepare Sage for deployment as a traditional theme, first run yarn build to compile the theme’s assets for production, then zip everything in the Sage folder except the node_modules directory.

3

@anyone This removing node_modules method from theme works, but the my-theme.zip file is still 23.3MB. Typically, WordPress themes are smaller. Is this size going to be okay for a site performance?

4

Why is your theme that large? What files are taking up so much space?

If it is assets, like images and videos, then they should be compressed because they will affect your site’s performance, but this is not unique or exclusive to Sage.

5

i forgot to mentioned that i made my-theme by just running the installation command without any code modifications.

my-theme $ du -sh *

4.0K	LICENSE.md
4.0K	README.md
 24K	app
8.0K	bin
4.0K	bud.config.js
4.0K	composer.json
212K	composer.lock
4.0K	functions.php
4.0K	index.php
4.0K	jsconfig.json
576K	package-lock.json
4.0K	package.json
384K	public
 92K	resources
4.0K	screenshot.png
4.0K	style.css
4.0K	tailwind.config.js
 32K	theme.json
 51M	vendor
300K	yarn.lock

It looks like the majority of the space is taken up by the vendor folder, so I guess this is expected?

6

I deploy automatically so often that I forgot, the docs point out you should be running composer install --no-dev --optimize-autoloader before zipping, too. That should make it smaller.

1 Like