先以下的 css 的处理我们都把 mode 设置为 production

webpack4 开始使用: mini-css-extract-plugin插件, 1-3 的版本可以用: extract-text-webpack-plugin

抽取了样式,就不能再用 style-loader注入到 html 中了。

npm install --save-dev mini-css-extract-plugin

再次运行打包:

在 dist 目录中已经把 css 抽取到单独的一个 css 文件中了。修改 html,引入此 css 就能看到结果了。

注意: 此时会报错: Error: No PostCSS Config found in...

 

webpack 样式表抽离成专门的单独文件并且设置版本号的更多相关文章

  1. CSS 层叠及样式表来源

    Web标准化运动的口号——分离.分离.分离. 在2003年的 SXSW 会议中, Steve Champeon 和 Nick Finck 做了一个名为“面向未来的全方位 Web 设计”的演讲,揭示了这 ...

  2. 【转】QT样式表 (QStyleSheet)

    作者:刘旭晖 Raymond 转载请注明出处Email:colorant@163.comBLOG:http://blog.csdn.net/colorant/ 除了子类化Style类,使用QT样式表( ...

  3. CSS级联样式表-css选择器

    CSS概念 Cascading Style sheet 级联样式表 表现HTMl或XHTML文件样式的计算机语言 包括对字体,颜色,边距,高度,宽度,背景图片,网页定位等设定 建议:把表示样式的代码从 ...

  4. QT样式表

    QT样式表 一.QT样式表简介 1.QT样式表简介 QSS的主要功能是使界面的表现与界面的元素分离,使得设计皮肤与界面控件分离的软件成为可能. QT样式表是允许用户定制widgets组件外观的强大机制 ...

  5. CSS中的层叠、特殊性、继承、样式表中的@import

    CSS中的层叠.特殊性.继承.样式表中的@import 层叠 CSS有一个机制是层叠,层叠可以理解为对样式的覆盖,优先性为: 网站开发者的样式表 用户样式(通过设置浏览器的显示选项) 浏览器默认的样式 ...

  6. Qt样式表——选择器详解(父子关系)

    在上一节中,小豆君给大家介绍了样式表的基本概念和大致用法.今天我们来详细了解下样式表中选择器的用法. 所谓选择器,就是指定你所设置的样式对哪个或哪些控件起作用. 到目前为止,Qt样式表支持CSS2中定 ...

  7. 0811 css样式表基本

    CSS(Cascading Style Sheets,层叠样式表),作用是美化HTML网页. /*注释*/    注释语法 1. 样式表分类 ①内联样式表 和html联合显示,控制精确,但是可重用性差 ...

  8. 在网页中插入CSS样式表的几种方法

    1. 链入外部样式表 链入外部样式表是把样式表保存为一个样式表文件,然后在页面中用<link>标记链接到这个样式表文件,这个<link>标记必须放到页面的<head> ...

  9. Qt中设置widget背景颜色/图片的注意事项(使用样式表 setStyleSheet())

    在Qt中设置widget背景颜色或者图片方法很多种:重写paintEvent() , 调色板QPalette , 样式表setStyleSheet等等. 但是各种方法都有其注意事项,如果不注意则很容易 ...

随机推荐

  1. 『简单积性函数和dirichlet卷积』

    简单积性函数 在学习欧拉函数的时候,相信读者对积性函数的概念已经有了一定的了解.接下来,我们将相信介绍几种简单的积性函数,以备\(dirichlet\)卷积的运用. 定义 数论函数:在数论上,对于定义 ...

  2. FreeSql.DbContext 第二个版本介绍

    FreeSql.DbContext 实现类似 EFCore 使用方法,跟踪对象状态,最终通过 SaveChanges 方法提交事务. 目前是第二个初版,已实现状态跟踪保存(导航属性的跟踪暂时不支持). ...

  3. Go:学习笔记兼吐槽(2)

    Go:学习笔记兼吐槽(1) Go:学习笔记兼吐槽(2) Go:学习笔记兼吐槽(3) 基本数据类型和string之间的转换 (1) 基本类型转string 使用 fmt.Sprintf(“%参数”, 表 ...

  4. git工具使用说明

    一.什么是git?     Git是分布式版本控制系统      概念: 工作区:就是你在电脑里能看到的目录: 暂存区:一般存放在(.git/index)中,所以我们把暂存区有时也叫作索引(index ...

  5. Java中char,short,int,long占几个字节和多少位

    1.字节:byte:用来计量存储容量的一种计量单位:位:bit 2.一个字节等于8位  1byte = 8bit char占用的是2个字节 16位,所以一个char类型的可以存储一个汉字. 整型: b ...

  6. webpack打包nodejs项目(前端代码)

    PS.若本文没有帮到你可以看看我的进阶版点此前往 适用情况 首先说明,此情况不具备普遍性.若你的情况与笔者类似那么希望这篇文章能够帮到你. 我的项目情况是这样的:用node.js做后台,ejs做模板引 ...

  7. ReactiveSwift源码解析(六) SignalProtocol的take(first)与collect()延展实现

    上篇博客我们聊了observe().map().filter()延展函数的具体实现方式以及使用方式.我们在之前的博客中已经聊过,Signal的主要功能是位于SignalProtocol的协议延展中的, ...

  8. Could not load file or assembly……

    今天在运行一个ASP.NET Core项目的时候发现这样的错误: 我一开始觉得这是个很简单的问题,很明显,出错的原因是项目中某些地方还保留了对Njt.MvcAuthLib这个库的引用,而现在我不需要了 ...

  9. Linux 桌面玩家指南:08. 使用 GCC 和 GNU Binutils 编写能在 x86 实模式运行的 16 位代码

    特别说明:要在我的随笔后写评论的小伙伴们请注意了,我的博客开启了 MathJax 数学公式支持,MathJax 使用$标记数学公式的开始和结束.如果某条评论中出现了两个$,MathJax 会将两个$之 ...

  10. Python就业指导

    一年一度的金三银四招聘旺季又要到了,最近有很多同学希望我能给他们一些关于python的就业指导:之前出过一期关于java的就业指导,但是并不是很完善,所以希望这期关于python的就业指导能够很全面很 ...