css module

如果想要使用

import styles from './index.less';

const XXX: React.FC<IProps> = function () {
  return (
    <div className={styles.bar}>
      <div>aaa</div>
    </div>
  );
};

对于vite是需要设置为 index.module.less 文件才行的

cn.vitejs.dev/guide/featu…

主要作用就是不污染其他文件，生成的class前面会带上hash值，就像vue文件的style部分声明scope一样

其他配置项基本不会用到

interface CSSModulesOptions {
  scopeBehaviour?: 'global' | 'local'
  globalModulePaths?: RegExp[]
  generateScopedName?:
    | string
    | ((name: string, filename: string, css: string) => string)
  hashPrefix?: string
  /**
   * 默认：null
   */
  localsConvention?:
    | 'camelCase'
    | 'camelCaseOnly'
    | 'dashes'
    | 'dashesOnly'
    | null
}