Webpack, babel и реагировать: удалить определенные имена классов из производственной сборки - PullRequest
Новая
       6

Webpack, babel и реагировать: удалить определенные имена классов из производственной сборки

0 голосов
/ 07 декабря 2018

В моем проекте я использую специальный тип classNames, начинающийся с 'u-', например, 'u-title_bar', для юнит-тестов.Я хотел бы удалить их из производственной сборки, есть ли инструмент для этого? 

// MyComponent.jsx
// u-my_comp is just for unit testing. my_comp is for styling
const MyComponent = () => <div className="u-my_comp my_comp">My Component</div>

// MyComponent.test.jsx
expect(myComponent.find('.u-my_comp).text()).toEqual('My Component');

// Expected result after cleanup: 
<div className="my_comp">My Component</div>

1 Ответ

0 голосов
/ 07 декабря 2018

Можно было бы обнаружить эти имена классов только с помощью специального преобразования Вавилона, и это не удалось бы для динамических имен классов.

В случае, если необходимо удалить все классы u-, должен быть создан помощник: 

const prodClassNames = (...classNames) => classNames
  .reduce((classNames, className) => classNames.concat(className.split(/\s+/)), [])
  .filter(className => process.env.NODE_ENV !== 'production' || !/^u-/.test(className))
  .join(' ');

Может использоваться как: 

<div className={prodClassNames('u-my_comp my_comp')}>My Component</div>

Или: 

<div className={prodClassNames('u-my_comp', 'my_comp')}>My Component</div>
...