Magento2: лучшая практика для модификации CSS-файлов

Я хочу изменить файл CSS pub/static/frontend/Magento/luma/en_US/css/styles-l.css.
Изначально этот файл отсутствует в папке pub / static и находится в

vendor/magento/theme-frontend-blank/web/css/styles-l.less (it's styles-l.less)

Когда я использую статическое содержимое php bin/magento setup:static-content:deploy, в pub / static создается 2 файла, связанных с ним.
1. pub/static/frontend/Magento/luma/en_US/css/styles-l.less
2. pub/static/frontend/Magento/luma/en_US/css/styles-l.css

Я поддерживаемый разработчик, и при разработке модулей я склонен удалять все, что присутствует в pub / static (кроме .htaccess). Так что для меня это не лучший вариант для прямой модификации pub/static/frontend/Magento/luma/en_US/css/styles-l.css.

В таком случае, какова лучшая практика для изменения вышеуказанного файла CSS?
1. Должен ли я изменить pub/static/frontend/Magento/luma/en_US/css/styles-l.lessили
2. Я неправильно понимаю, что могу удалить все из pub/static(во время разработки), и я должен изменить pub/static/frontend/Magento/luma/en_US/css/styles-l.cssи никогда не удалять это.

Вы не должны редактировать / изменять файлы в каталоге pub / * или vendor / *. Pub предназначен для развертывания, а vendor - для структуры по умолчанию, которую вы переопределяете с помощью своего шаблона или пользовательских модулей. Вместо:

• создайте новую тему в приложении / design / frontend / {vendor} / {yourTheme} /. Вы можете использовать бланк или тему Luma. Вы также можете создать новую тему, которая наследуется от Blank (наследование определяется в theme.xml). Если вы уже используете какую-то тему, пропустите этот шаг.
• отредактируйте .less в своей теме, чтобы изменения оставались видимыми и не заменялись при очистке кэша или обновлении системы.
• Используйте grunt для компиляции вашего .less в файлы развертывания.
• Вы также можете настроить исходные карты для точного определения стиля в файлах .less, чтобы повысить производительность.

Несколько полезных ссылок:

• Начало работы с Меньше
• Меньше отладки в Magento 2
• Создать тему в Magento 2
• Начало работы с Grunt
• Библиотека Magento UI

Этот подход сработал для меня

Внесите необходимые изменения в файл .less, а затем выполните следующие команды:

php bin/magento setup:upgrade

php bin/magento cache:flush

Если другая тема, вы должны настроить:

module.exports = {
    blank: {
        area: 'frontend',
        name: 'Magento/blank',
        locale: 'en_US',
        files: [
            'css/styles-m',
            'css/styles-l',
            'css/email',
            'css/email-inline'
        ],
        dsl: 'less'
    },
    luma: {
        area: 'frontend',
        name: 'Magento/luma',
        locale: 'en_US',
        files: [
            'css/styles-m',
            'css/styles-l'
        ],
        dsl: 'less'
    },

    porto: {
        area: 'frontend',
        name: 'Smartwave/porto',
        locale: 'zh_Hans_CN',
        files: [
            'css/styles-m',
            'css/styles-l'
        ],
        dsl: 'less'
    },

    backend: {
        area: 'adminhtml',
        name: 'Magento/backend',
        locale: 'en_US',
        files: [
            'css/styles-old',
            'css/styles'
        ],
        dsl: 'less'
    }
};

Это блок-схема того, как magento2 обрабатывает CSS-файлы.

Источник: Inchoo

Я бы предложил выполнить

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

Как вы знаете,

php bin/magento setup:upgrade

очистит кеш и статический контент, и

php bin/magento setup:static-content:deploy 

развернет все темы в <mageroot>/pubпапке. Эта команда значительно уменьшит время первой загрузки вашего магазина.