SnowdogApps / magento2-frontools

Set of front-end tools for Magento 2 based on Gulp.js
MIT License
430 stars 142 forks source link

Production Flow #447

Closed vy-shmal closed 2 years ago

vy-shmal commented 2 years ago

Hello evrybody,

I have a problem to understand how to implement the frontools in the production. Here is what I have done so far.

The thing I dont understad is, when you completed with the development and you have created the production css, how you make them permanent to the theme?

Magento by default, searches for any .less and after .css files inside the theme and add them to the var/viewpreprocessed and after inside pub/static/ . On the production the static folder getting deleted, if you install a module lets say. If the .css files arent inside the theme, they wont be created again in the pub/static folder .

Is there any automation to add the .css files to the theme files ?

Thank you in advance.

Igloczek commented 2 years ago

There are two ways to get assets on the production server:

  1. Recommended During the deployment process, or on CI pipeline while you are building the application, after running bin/magento setup:static-content:deploy, you need to run tasks from Frontools, for example npm run styles -- --prod to compile styles to the pub/static directory.

    It's kinda like running bin/magento setup:di:compile, you do this in the place you need the app to work, not to store that stuff in the repository.

  2. Old fashion / not-recommended In themes.json you can set as dest the same directory as src, so you will end writing the compiled styles to the theme repository, you can then commit them and push to production, without any processing later.

vy-shmal commented 2 years ago

Thanks @Igloczek for the answare.

One more thing, the custom modules that have _module.less styling as I understand these wont work with the classic way.
The thing I have to do is to owerwrite them to .scss syntax and add them to the themes styles, am I correct ?

Igloczek commented 2 years ago

It's the recommended way to keep everything in SASS files, and don't care about Magento magic related to automatically importing LESS files. So you need to "translate" them, less2scss might be handy, especially if you have a lot of stuff to convert.

But if you want, you can keep using LESS alongside with SASS, just make sure the LESS compilation output will not be overwritten.