Book Image

Practical Module development for Prestashop 8

By : Louis AUTHIE
Book Image

Practical Module development for Prestashop 8

By: Louis AUTHIE

Overview of this book

After version 1.7, PrestaShop underwent a host of changes, including migration to a Symfony-based system from an outdated legacy code. This migration brought about significant changes for developers, from routine maintenance to module development. Practical Module Development for PrestaShop 8 is curated to help you explore the system architecture, including migrated and non-migrated controllers, with a concise data structure overview. You’ll understand how hooks enable module customization and optimize the CMS. Through the creation of seven modules, you’ll learn about the structure of modules, hook registration, the creation of front-office controllers, and Symfony back-office controllers. By using Doctrine entities, services, CQRS, grids, and forms, you’ll be guided through the creation of standard, payment and carrier modules. Additionally, you'll customize and override themes to achieve your desired e-commerce store look. By the end of this book, you’ll be well equipped to provide modern solutions with PrestaShop that meet client requirements.
Table of Contents (23 chapters)
1
Part 1 – Understanding How PrestaShop is Structured and How It Works
8
Part 2 – How to Create Your Own Modules
16
Part 3 – Customizing Your Theme
Appendix – Module Upgrade, The Hooks Discovery Tool, and Multi-Store Functions

Discovering the structure of a Webpack config file

If we want to use Webpack correctly, we need to understand the structure of the webpack.config.js file, which will set the behavior of Webpack executions.

Let’s open the _dev/webpack.config.js file and see how it works. By going through it line by line, we will first find the required JavaScript libraries block calls. We can find the following requirements:

  • Path: provides a way of working with directories and file paths
  • MiniCssExtractPlugin: enables creating a separate CSS file if an SCSS or a CSS is in the entry list or in a file
  • Terser: enables minifying/minimizing the JavaScript scripts
  • CSSO: enables cleaning and minifying CSS code
  • LicensePlugin: cleans the license code from plugins and stores it in the same file instead

Then, let’s see how the entry field is defined and what it stands for:

entry: {
     theme: ['./js/theme.js', './css/theme...