How to Deploy Static Content in Magento 2

In this tutorial, we will talk about Deploy Static Content setup:static-content:deploy in Command Line Series. As you know, from Magento 2, they add many commands in bin/magento. This may difficult to get approach this, let me explain more detail about Deploy Static Content.

What is Static Content in Magento 2?

In Magento 2, static content refers to files that don’t change frequently and can be cached by the browser for faster loading times. These files are typically located in the pub/static directory of your Magento installation.

5 types of Static Content

• CSS (Cascading Style Sheets): Files that define the visual style of your store, like fonts, colors, and layout
• JavaScript: Code files that add interactivity to your store, like product carousels or image zoom features
• Images: Product images, logos, icons, and other visual elements
• Fonts: Custom fonts used for your store’s branding

Benefits of static content

• Faster Loading Times: Since the browser can cache static content, it doesn’t need to download them again on subsequent visits, leading to a quicker loading experience for your customers.
• Reduced Server Load: By serving static content directly, less strain is put on your Magento server, improving overall performance.
• Improved Scalability: A well-configured caching strategy for static content can handle increased traffic volumes more efficiently.

Deployment of Static Content:

The way static content is deployed depends on your Magento 2 mode:

• Production Mode: In production mode, you typically need to use a deployment command to write the static content files to the Magento file system for optimal performance and security.
• Developer Mode: In developer mode, changes to static content are usually reflected automatically without needing a deployment step. However, this is not recommended for production environments.

Overview of static view files deployment

First of all, let’s get to know more about the static view.

Static here means that the files which are not dynamically generated can be cached. The word “view” refers to the presentation layer from Model-View-Controller (MVC).

The deployment of static view files is influenced by three Magento modes including Production mode, Default mode, and Developer mode. The static view files deployment command enables you to write the static content file when Magento 2 store is in production mode.

Deploy Static Content via command line

Go to Magento admin root folder and show usages:

php bin/magento setup:static-content:deploy -h

Output:

Usage:
  setup:static-content:deploy [options] [--] [<languages>]...

Arguments:
  languages                                  Space-separated list of ISO-636 language codes for which to output static view files.

Options:
  -f, --force                                Deploy files in any mode.
  -s, --strategy[=STRATEGY]                  Deploy files using specified strategy. [default: "quick"]
  -a, --area[=AREA]                          Generate files only for the specified areas. [default: ["all"]] (multiple values allowed)
      --exclude-area[=EXCLUDE-AREA]          Do not generate files for the specified areas. [default: ["none"]] (multiple values allowed)
  -t, --theme[=THEME]                        Generate static view files for only the specified themes. [default: ["all"]] (multiple values allowed)
      --exclude-theme[=EXCLUDE-THEME]        Do not generate files for the specified themes. [default: ["none"]] (multiple values allowed)
  -l, --language[=LANGUAGE]                  Generate files only for the specified languages. [default: ["all"]] (multiple values allowed)
      --exclude-language[=EXCLUDE-LANGUAGE]  Do not generate files for the specified languages. [default: ["none"]] (multiple values allowed)
  -j, --jobs[=JOBS]                          Enable parallel processing using the specified number of jobs. [default: 0]
      --symlink-locale                       Create symlinks for the files of those locales, which are passed for deployment, but have no customizations.
      --content-version=CONTENT-VERSION      Custom version of static content can be used if running deployment on multiple nodes to ensure that static content version is identical and caching works properly.
      --refresh-content-version-only         Refreshing the version of static content only can be used to refresh static content in browser cache and CDN cache.
      --no-javascript                        Do not deploy JavaScript files.
      --no-css                               Do not deploy CSS files.
      --no-less                              Do not deploy LESS files.
      --no-images                            Do not deploy images.
      --no-fonts                             Do not deploy font files.
      --no-html                              Do not deploy HTML files.
      --no-misc                              Do not deploy files of other types (.md, .jbf, .csv, etc.).
      --no-html-minify                       Do not minify HTML files.
  -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
  -v|vv|vvv, --verbose                       Increase the verbosity of messages: 1 for normal output, 2 for more verbose output and 3 for debug

Help:
  Deploys static view files                                                                 

Syntax

Simple run the following command line to deploy static content your store when install / update an extension via composer

php bin/magento setup:static-content:deploy

FAQ

1. What is static content deploy in Magento 2?

Static content deployment in Magento 2 refers to the process of generating and integrating static files like CSS, JavaScript, and images into the Magento file system. This is particularly done when the system is set to production mode. It ensures that these static assets are readily available and optimized for performance, enhancing the overall user experience of the Magento store.

2. What are the three static deployment strategies in Magento 2?

In Magento 2, there are three static deployment strategies:

On Demand: This strategy generates static files dynamically during runtime, serving them directly to users when requested.

On Schedule: Static files are generated and deployed periodically, typically through a cron job.

On Deploy: Static files are generated and deployed during deployment or installation processes.

3. How can the bin Magento setup static content deploy command be used?

Please follow these steps:

• Sep 1: Log in or switch to your Magento 2 file system owner.

• Step 2: Remove the content under <your Magento install dir>/pub/static.

• Step 3: Run the static view files deployment tool using the command: <your Magento install dir>/bin/magento setup:static-content:deploy

4. How does the theme Magento Luma affect the deployment process?

The default theme for Magento 2 is the Magento Luma theme. When static content is deployed, the files associated with the Luma theme are included in the deployment procedure. Modifying the Luma theme or opting for a different theme may necessitate extra steps during deployment.

Conclusion

This is a short and easy instruction about deploying static view files to create static content via the command line. If you encounter any problems while following this tutorial, please feel free to leave comments and we’ll answer as soon as possible.