使用Webpack在JavaScript和SASS之间共享类名？

Question

如何将我的JavaScript和SASS之间的类名作为变量与Webpack共享？

我已经这样分享了一个整数:

在我的SASS中:

$animationSpeed: 400;
:export {
  animationSpeed: $animationSpeed;
}

在我的JS中:

import styles from './styles.scss';
const animationSpeed = parseInt(styles.animationSpeed);

我可以在我的SASS中将classname变为一个变量:

$animationClass: item--animating;
:export {
  animationClass: $animationClass;
}
.#{$animationClass} {
  // styles here
}

然而,这在我的JS doenst工作.我假设它是因为parseInt用于整数.

const animationClass = parseInt(styles.animationClass);

Answer 1

哎哟！这真的很简单：

$animationClass: item--animating;
:export {
  animationClass: $animationClass;
}
.#{$animationClass} {
  // styles here
}

import styles from './styles.scss';
const animationClass = styles.animationClass;