Webpack 4 + Material-UI: Как работает минимизация JSS в производственном режиме?

Question

Я работаю над проектом, используя Webpack 4.10.2 и Material-UI v1.1.0 . MUI docs говорит о генераторе имен классов, и я согласен с результатом сокращения имен классов, но есть кое-что, чего я не понимаю в процессе сборки, возможно, мне не хватает модуля или плагина Webpack(Я, например, просто использую babel-загрузчик, а не плагин).Я только что попробовал много комбинаций с UglifyJsPlugin (через оптимизацию.minimizer) компресс и искажение , но ничего не работает.

Проблема:

Имена классов, введенные в теги стиля документа, сокращены, но не соответствующие классы в теле:

Режим разработки

Все нормально, когда я строю свой проект в режиме разработки, используяwebpack -d:

<style type="text/css" data-jss="" data-meta="LayoutNavBar">
    .LayoutNavBar-flex-4 {
      flex: 1;
    }
</style>

и в теле соответствующие классы

<h2 class="LayoutNavBar-flex-4">Title</h2>

Режим производства

Стили нарушены при сборкев производственном режиме у меня есть встроенный стиль с укороченными именами классов (это хорошо):

<style type="text/css" data-jss="" data-meta="LayoutNavBar">
    .jss4 {
      flex: 1;
    }
</style>

, но в теле , классы CSS все еще с их длинных имен :

<h2 class="LayoutNavBar-flex-4">Title</h2>

вместо:

<h2 class="jss4">Title</h2>

Чего мне не хватает, чтобы заставить его работать?Спасибо

Answer 1

У меня была такая же проблема.В моем случае я исключил node_modules из комплекта сервера, поэтому Webpack не заменял process.env.NODE_ENV в файлах модуля, тогда как в моем клиентском комплекте, где было включено node_modules, это было сделано.Поэтому, чтобы минимизировать CSS на сервере, вам нужно либо включить node_modules в комплект, либо установить переменную окружения NODE_ENV в сеансе командной строки, с которого запускается комплект сервера.

Лучшая платформа-agnostic) способ, который я мог найти, это запустить "npm start --production" или добавить его как скрипт в package.json.Это автоматически установит переменную окружения NODE_ENV сеанса узла, запускаемого сценарием, на production.