javascript - 丑化 css 类名，如 instagram 或 facebook

Question

我如何像在 Instagram 或 Facebook 上那样丑化我的 css 文件？

例如 _8f735、_oofbn、_6ltyr这是一些 react 插件还是什么？我只在 Instagram 和 Facebook 上看到了这个。

Answer 1

看看CSS Modules .

示例来自 React CSS Modules :

In the context of React, CSS Modules look like this:

import React from 'react';
import styles from './table.css';

export default class Table extends React.Component {
    render () {
        return <div className={styles.table}>
            <div className={styles.row}>
                <div className={styles.cell}>A0</div>
                <div className={styles.cell}>B0</div>
            </div>
        </div>;
    }
}

Rendering the component will produce a markup similar to:

<div class="table__table___32osj">
    <div class="table__row___2w27N">
        <div class="table__cell___2w27N">A0</div>
        <div class="table__cell___1oVw5">B0</div>
    </div>
</div>

and a corresponding CSS file that matches those CSS classes.

重要:类名可以有不同的格式。