Как объединить классы CSS в один импортируемый объект - PullRequest
0 голосов
/ 21 июня 2019

В настоящее время я пытаюсь настроить приложение реакции с помощью css-модулей. В своем исследовании я наткнулся на эту странную «скомпилированную» функцию css, представляющую имена классов css из css-модулей. По крайней мере, я так думаю. Как вы можете видеть в примере кода, все функции имеют номера в качестве имени, и есть объединенные имена нескольких классов CSS (например, 5721 - content: "content-12UI7d flex-1O1GKY justifyCenter-3D2jYp"). Может быть, кто-то может показать мне, как настроить этот вид импорта CSS / JS.

Thx Jani

5721: function(e, t, o) {
        e.exports = {
            flex: "flex-1O1GKY",
            justifyCenter: "justifyCenter-3D2jYp",
            marginBottom20: "marginBottom20-32qID7",
            size18: "size18-3EXdSj",
            height24: "height24-3XzeJx",
            content: "content-12UI7d flex-1O1GKY justifyCenter-3D2jYp",
            image: "image-2n9YoQ",
            title: "title-rv8Fft marginBottom20-32qID7 size18-3EXdSj height24-3XzeJx",
            formItem: "formItem-HhFqlF marginBottom20-32qID7",
            logout: "logout-237t5C"
        }
    },
5722: function(e, t, o) {
        e.exports = {
            vertical: "vertical-V37hAW flex-1O1GKY directionColumn-35P_nr",
            alignCenter: "alignCenter-1dQNNs",
            marginTop20: "marginTop20-3TxNs6",
            marginBottom20: "marginBottom20-32qID7",
            marginBottom40: "marginBottom40-2vIwTv",
            size18: "size18-3EXdSj",
            height24: "height24-3XzeJx",
            modal: "modal-3YfEfS size18-3EXdSj height24-3XzeJx",
            content: "content-thnEEj vertical-V37hAW flex-1O1GKY directionColumn-35P_nr alignCenter-1dQNNs",
            closeButton: "closeButton-BJGJeO",
            image: "image-2lEAkj marginBottom20-32qID7",
            title: "title-3CgDLA marginBottom40-2vIwTv",
            appPromotion: "appPromotion-2PUSOL marginBottom20-32qID7"
        }
    },
5723: function(e, t, o) {
        e.exports = {
            marginBottom20: "marginBottom20-32qID7",
            marginTop8: "marginTop8-1DLZ1n",
            marginReset: "marginReset-236NPn",
            marginTop4: "marginTop4-2BNfKC",
            modal: "modal-2VIBV8",
            footer: "footer-1oJbSA",
            description: "description-zfMhzy marginBottom20-32qID7",
            name: "name-3ChUIO marginBottom20-32qID7",
            type: "type-3aEJ96 marginBottom20-32qID7",
            cloneInfo: "cloneInfo-1OC_Ee marginTop8-1DLZ1n",
            icon: "icon-3pNFyS",
            error: "error-chiOuv marginTop8-1DLZ1n",
            header: "header-3nFfBB marginReset-236NPn",
            clone: "clone-14QU8p marginTop4-2BNfKC",
            permissionsTitle: "permissionsTitle-2yG7gU marginBottom20-32qID7",
            foreground: "foreground-SshK2E",
            background: "background-6FOJIb",
            switchIcon: "switchIcon-_4Efyi",
            storeChannelOptionSelector: "storeChannelOptionSelector-2rFIBx",
            subtitle: "subtitle-3csUrC"
        }
    },
...