Deploying your Theme to Production
Deploying a Hyvä theme requires building the production
The recommended steps to deploy a Magento theme to production are as follows.
The Build Environment
Where to build
We recommend building the
styles.css as described below on a development, staging or build environment, instead of on the production host, because it requires a node.js installation.
As a rule of thumb, build tools should not be installed on a production environment as a security consideration.
If you run an automated CI pipeline, use
npm ci instead of
npm install to install the tailwind dependencies.
The reason is that
npm install might install newer package versions, while
npm ci gives you a repeatable build with the exact package versions listed in
npm run build-prod
npm run build-prod in your themes
This command will generate the minified
web/css/styles.css file in your theme.
Tip: You can use the
--prefix argument to run this command from the Magento base directory:
This step will copy the generated
web/css/styles.css file into the
pub/static/frontend/Your/theme/en_US/css/styles.css directory structure so it can be loaded by browsers with Magento running in production mode.
Note: the exact path depends on your theme and locale configuration and will be different from the example here.
Speed up static asset deployment
To speed up the deployment, we recommend disabling minification and bundling, and only generating the admin theme for the locales it is used with. For example, this is a common scenario:
# Only generate the backend assets with the en_US locale bin/magento setup:static-content:deploy -j 2 -f --no-parent --theme=Magento/backend en_US # Generate the frontend theme assents using the nl_NL and de_DE locale, skipping luma based themes bin/magento setup:static-content:deploy -j 2 -f --area=frontend --no-parent --no-less --no-js-bundle --no-html-minify --theme=customer/theme --no-parent nl_NL de_DE
3. Deploy to the production host
pub/static/ directory to your production host.
Now visitors will see your updated theme.