从 CRA 迁移到 Gatsby 破坏了 JSS 插件答案

【问题标题】：Moving from CRA to Gatsby broke JSS plugins从 CRA 迁移到 Gatsby 破坏了 JSS 插件
【发布时间】：2020-08-14 19:59:06
【问题描述】：

在create-react-app 中，我使用的是react-jss，因为默认情况下不包含jss-plugin-expand 插件。我有<StylesProvider jss={reactJss}>，一切正常。但是，现在我切换到 Gatsby，完全相同的设置停止工作。 flex: [1, 1, '70px'] 现在编译为 flex: 1, 1, 70px（带逗号）。

import React from 'react'
import { jss } from 'react-jss'
import { StylesProvider, ThemeProvider } from '@material-ui/core/styles'
import CssBaseline from '@material-ui/core/CssBaseline'

export default function PagesLayout({children}){
  return (
    <StylesProvider jss={jss}>
      <ThemeProvider theme={theme}>
        {children}
      </ThemeProvider>
    </StylesProvider>
  )
}

我能想到的唯一区别是，现在这个文件是一个包装器，并且有 {children} 而不是 <App/>

版本：

"react-jss": "^10.3.0",
"@material-ui/core": "^4.11.0",
"react": "^16.12.0",

【问题讨论】：

标签： reactjs material-ui gatsby jss

【解决方案1】：

你知道在 Gatsby 中，react-jss(jss) 比基础 react 项目更难使用。我和你一样面临上面的问题，你可以通过使用更多 Gatsby 插件和一些配置来解决它

这里有详细信息： https://www.gatsbyjs.com/plugins/gatsby-plugin-jss-provider/

【讨论】：