Skip to main content

Bundle & Static Assets

Bundles

In Project Zero, style and Javascript files are automatically converted to bundles using webpack. Bundle files and static asset files are located in the static_omnishop directory.

Style files (.scss) are automatically minimized at compilation time and combined into a single file as a bundle. This file is located in the css directory under static_omnishop. Javascript files are also minimized at compilation time and combined in the bundle file. But here, two different bundles are created under js directory. app-legacy.js is created for legacy browsers and app.js for modern browsers. In modern browsers, app.js is included in the page as a module.

Static Assets

In project zero, static asset files are located in the distribution directory. If you want to use static assets such as images, fonts, etc., it is recommended that these files be placed in the templates/assets directory. By default, webpack loaders are added for some file types in Project Zero. webpack moves the asset files to the relevant folder at the time of compilation according to these file types. The file types added by default and the directories to which they were moved are listed below.

Images

All image files with png, jpg, jpeg, gif, svg and webp extensions are automatically moved by the webpack to the static_omnishop/img directory. Images used in templates are not automatically moved. For files you want to move, you have to import them in JS or you have to manually copy these files to the static_omnishop/img directory after compilation.

Fonts

The font files (ttf, eot, woff and woff2) that you use in the project are automatically moved to the static_omnishop/fonts directory by the webpack loader.

Other File Types

File types other than image and font are not automatically copied to the distribution directory. If you want such files to be moved, you need to add the relevant webpack loader to the project.