@情感/核心@情感/风格的情感主题可以和电子一起使用吗？

Question

我试图将情感整合到我的电子应用程序中，但遇到了一些麻烦，似乎找不到任何关于它的讨论。我使用的样板是electron-react-boilerplate。在开发构建期间，似乎一切都正常，但当我为生产构建时，我就收到了这个错误：

​

​

任何指导或帮助都是很棒的！我看到有一些情感主题的高级选项，我可能需要使用CacheProvider，但不确定如何将它们与电子一起使用……

谢谢!

Answer 1

我想通了。在app/index.tsx中，您需要设置将使用CacheProvider和createCache手动注入脚本的容器，因为实际的ReactDOM.render发生在文档事件侦听器中。此处是完整的index.tsx文件：

import 'styles/index.css'

import createCache from '@emotion/cache'
import { CacheProvider } from '@emotion/core'
import React, { Fragment } from 'react'
import { render } from 'react-dom'
import { AppContainer as ReactHotAppContainer } from 'react-hot-loader'

import Root from './containers/Root'
import { configureStore } from './store/configureStore'

const AppContainer = process.env.PLAIN_HMR ? Fragment : ReactHotAppContainer

const { store, persistor } = configureStore()

document.addEventListener('DOMContentLoaded', async () => {
    const myCache = createCache({
        container: document.head,
    })

    // Render
    return render(
        <CacheProvider value={myCache}>
            <AppContainer>
                <Root store={store} persistor={persistor} />
            </AppContainer>
        </CacheProvider>,
        document.getElementById('root')
    )
})