最新版的 styled-components v4 已经将原有的 injectGlobal() 方法替换成了 createGlobalStyle() ,而且用法也和之前的 injectGlobal 方法不同了。

注意:直接像原 injectGlobal 方法一样使用不能生效,要定义一个全局样式变量,这个变量将作为组件插入文档。

具体解决方式:

1. 用createGlobalStyle定义全局样式

import { createGlobalStyle } from 'styled-components'

export const Globalstyle = createGlobalStyle`

body{

margin:0;

padding:0;

font-family:sans-serif;

background:green;

}

`

styled-components解决全局样式'injectGlobal' 废除的问题的更多相关文章

  1. styled components草根中文版文档

    1.styled components官网网址 https://www.styled-components.com/docs   以组件的形式来写样式. 1.1安装 yarn add styled-c ...

  2. bootstrap 全局样式设置

    HTML <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" co ...

  3. BootStrap入门教程 (一) :手脚架Scaffolding(全局样式(Global Style),格网系统(Grid System),流式格网(Fluid grid System),自定义(Customing),布局(Layouts))

    2011年,twitter的“一小撮”工程师为了提高他们内部的分析和管理能力,用业余时间为他们的产品构建了一套易用.优雅.灵活.可扩展的前端工具集--BootStrap.Bootstrap由MARK ...

  4. bootstrap复习:全局样式

    一.概览 1.Bootstrap 是移动设备优先的. 2.在移动设备浏览器上,通过为视口(viewport)设置 meta 属性为 user-scalable=no 可以禁用其缩放(zooming)功 ...

  5. 【JAVAWEB学习笔记】24_filter实现自动登录和解决全局的编码问题

    过滤器Filter 学习目标 案例-自动登录 案例-解决全局的编码 一.过滤器Filter 1.filter的简介 filter是对客户端访问资源的过滤,符合条件放行,不符合条件不放行,并且可以对目标 ...

  6. 全局css , 样式设置, css 初始化. css ,style ,全局样式, 初始化样式

    全局CSS设置总结 1.清除所有标记的内外边距 html, body, ul, li, ol, dl, dd, dt, p, h1, h2, h3, h4, h5, h6, form, fieldse ...

  7. taro 组件的外部样式和全局样式

    自定义组件对应的样式文件,只对该组件内的节点生效. 编写组件样式时,需要注意以下几点: 组件和引用组件的页面不能使用 id 选择器(#a).属性选择器([a])和标签名选择器,请改用 class 选择 ...

  8. 关于微信小程序中组件和页面对全局样式的继承性

    1.组件只能继承全局样式中的font和color(backgroundcolor不继承) 2.页面可以继承全局样式中所有样式

  9. bootstrap基础学习小记(一)简介模板、全局样式

    2011年,twitter的“一小撮”工程师为了提高他们内部的分析和管理能力,用业余时间为他们的产品构建了一套易用.优雅.灵活.可扩展的前端工具集--BootStrap.Bootstrap由MARK ...

随机推荐

  1. Java基础之 反射是什么?

    什么是反射,反射能干嘛? 反射是:指程序可以访问.检测和修改它本身状态或行为的一种能力 反射是一种能力,所以给的定义就是说明了它能干嘛. 我们平时用反射主要做: 获取类型的相关信息 动态调用方法 动态 ...

  2. AspNetCore中使用Ocelot之 IdentityServer4(1)

    AspNetCore中使用Ocelot之 IdentityServer4(1) 前言: OceLot网关是基于AspNetCore 产生的可扩展的高性能的企业级Api网关,目前已经基于2.0 升级版本 ...

  3. Netty中的Channel之数据冲刷与线程安全(writeAndFlush)

    本文首发于本博客,如需转载,请申明出处. GitHub项目地址 InChat 一个轻量级.高效率的支持多端(应用与硬件Iot)的异步网络应用通讯框架 前言 本文预设读者已经了解了一定的Netty基础知 ...

  4. 微信H5页面 会被软键盘顶起来

    问题描述:H5页面在微信中打开,input输入框获取焦点时,页面被软键盘顶上去:关闭软键盘时,页面不会自动下来(恢复初始状态) H5页面在微信中初始状态如下图: input输入框获取焦点时,页面被软键 ...

  5. js 骂人不带脏字 (!(~+[]) + {})[--[~+""][+[]] * [~+[]] + ~~!+[]] + ({} + [])[[~!+[]] * ~+[]] 图解

    看到掘金上翻出一个老梗,前端如何不带脏字得骂产品经理傻逼(sb),复制(!(~+[]) + {})[--[~+""][+[]] * [~+[]] + ~~!+[]] + ({} + ...

  6. arcgis api 3.x for js 热力图优化篇-不依赖地图服务(附源码下载)

    前言 关于本篇功能实现用到的 api 涉及类看不懂的,请参照 esri 官网的 arcgis api 3.x for js:esri 官网 api,里面详细的介绍 arcgis api 3.x 各个类 ...

  7. Web API 持续集成:PostMan+Newman+Jenkins(图文讲解)

    本文由葡萄城技术团队于博客园原创并首发 转载请注明出处:葡萄城官网,葡萄城为开发者提供专业的开发工具.解决方案和服务,赋能开发者. 上篇文章我们已经完成了API测试工具选型,接下来是一系列周期性的开发 ...

  8. Android 字体适配方案

    开发过程中,按照UI设计尺寸做好UI页面,当用户自定义自己的手机字体大小之后UI完全没法看了,这个时候就在想让app字体大小始终一致就好了 下面看一下,出现的问题和解决方案     做个简单的例子,先 ...

  9. Java Memory Management

    How Memory works in Java The role of the stack - Each time you call a function, Java pushed the loca ...

  10. 开启远程桌面连接windows的方法以及遇到的问题

    确认电脑的远程服务是否已经开启 开始--运行--输入“services.msc ”,打开服务,找到三个remote desktop开头的服务 Remote Desktop Configuration. ...