I. Emergence of Problems:
- , in the previous project development, the error occurred when applying
male-components , applying injectGlobal to define style variables, and injectGlobal 'is not exported from' application-components '. Ii. Analysis and Solution of problems:
The reason for
- problem is that
The injectGlobal API was removed and removed by createGlobalStyle in styled-components v4. API is removed and replaced by malt-components v4. Replaced with createGlobalStyle the new API appears as a style component and is introduced as a label based on the style component idea. InjectGlobal cannot be applied directly as the original injectGlobal. We define a global style variable that will be inserted into the document as a component. Solution: The first step is to define the global style with createGlobalStyle and wrap the global style in it. Wrap the CSS style with the back-quotation string, as shown below:
import { createGlobalStyle } from 'styled-components'
export const Globalstyle = createGlobalStyle`
body{
margin: 0;
padding: 0
}`
The second step is to import the style in the project main file. The code is as follows:
import { Globalstyle } from './style'
The third step is introduced as a label in the form of a style component, as shown below:
class App extends Component {
render () {
return (
<Fragment>
<GlobalStyled/>
</Fragment>
)
}
}
