<!--本节   loader配置处理css样式

   在src下新建css文件夹   在css下创建index.css
在main.js这个入口文件中 引入js模块 和 css杨思表是不同的 在main.js文件中 import './css/index.css' 注意:webpack默认只能打包处理JS类型的文件 无法处理其他的非JS类型的文件
如果处理其他非js类型的文件 需要安装第三方的loader加载器
cnpm i style-loader css-loader -D 需要安装两个加载器 这个凉饿模块处理css 打开webpack.config.js这个文件
在里面新增一个配置的节点,是module他是一个对象,在module这个对象上,
有一个属性rules,这个属性是一个数组,在这个数组中,存放了所有的第三方文件的匹配和处理规则 webpack.config.js文件如下
module:{ //这个节点 用于配置 所有的第三方 加载器 rules:[ //所有第三方模块的匹配规则
{ test: /\.css$/, use: ['style-loader','css-loader']}
]
} ps==>test中loader的加载规则是从右向左的哦 先加载css-loader 在加载style-loader

07webpack--下载对应的css模块的更多相关文章

  1. Pure – 赞!轻量的、响应式的 CSS 模块集

    Pure 是一组轻量的,响应式的 CSS 模块,您可以使用在任何的 Web 项目中.充分考虑了移动设备中的使用,保持文件体积尽量小,每行 CSS 都进行了仔细的考虑. Pure 基于 Normaliz ...

  2. [转]CSS 模块

    CSS 模块 如果你想知道 CSS 最近发展的转折点,你应该选择去观看 Christopher Chedeau 在2014年11月的 NationJS 大会上做的名称为 CSS in JS 的分享.不 ...

  3. CSS 模块的侦测

    CSS 的规格发展太快,新的模块层出不穷.不同浏览器的不同版本,对 CSS 模块的支持情况都不一样.有时候,需要知道当前浏览器是否支持某个模块,这就叫做“CSS模块的侦测”. 一个比较普遍适用的方法是 ...

  4. [翻译]CSS模块-未来的编码方式

    前言 这是Glen Maddern发布于2015年8月19日的一篇文章,主要是之前翻译的文章<理解CSS模块方法>里提到这篇文章,现在算是顺藤摸瓜跟进来看看. 这里的翻译都是根据我自己的理 ...

  5. [翻译]理解CSS模块方法

    在这个前端发展日新月异的世界,能够找到有所影响的概念相当困难,而将其准确无误的传达,让人们愿意尝试,更是难上加难. 拿CSS来看,在我们写CSS时,工具侧最大的变化,也就是CSS处理器的使用,如:可能 ...

  6. Webpack4 学习笔记二 CSS模块转换

    前言 此内容是个人学习笔记,以便日后翻阅.非教程,如有错误还请指出 webpack 打包css模块 webpack是js模块打包器, 如果在入口文件引入css文件或其它的less.sass等文件,需要 ...

  7. 第5章 网页下载器和urllib2模块

    网页下载器:将互联网上URL对应的网页下载到本地的工具 通过网页下载器将互联网中的url网页,存储到本地或内存字符串 python有哪几种网页下载器? 1.urllib2  python官方基础模块 ...

  8. 51CTO下载-html+javascript+css学习宝典

    一.html知识 1. meta标签 Meta: 提供网页信息,搜索引擎使用 <meta name=“aa” content=“bbb”> <meta http-equiv=“exp ...

  9. 下载网站js css img 资源

随机推荐

  1. 7、zabbix自定义监控阈值-前端页面报警

    找个值监控一下: #监控passwd #默认是间隔是1小时,我们改成10秒,下面我们要把报警打开 #我们在被监控上的主机上创建一个新用户,过10秒,界面上就会报警了 ----------------- ...

  2. Jmeter怎么搭建环境

    1.JDK检查与安装 cmd输入命令:java -version   -- 检查主机是否安装了JDK JDK下载官网:https://www.oracle.com/technetwork/java/j ...

  3. 工具资源系列之给 windows 装个 vmware 虚拟机

    如果长时间处于同一种环境,慢慢得我们会觉得有些无聊,所以适当地出去走走看看外面的世界能带给我们不一样的体验. 所以,何不出去走走,看看另一个世界? 然而,平时需要工作很难抽身无所顾忌地潇洒走开,这是不 ...

  4. aliyun-OSS断点续传

    阿里云OSS断点续传(Java版本) 在工作中发现开发的某项功能在用户网络环境差的时候部分图片无法显示,通过Review代码之后发现原来是图片上传到了国外的亚马逊服务器上,经过讨论决定将图片上传到国内 ...

  5. pandas-缺失值处理

    import pandas as pd import numpy as np Step 1.加载数据集 # header=0以第一行作为列名 tip = pd.read_csv("lianx ...

  6. 【day06】PHP

    一.字符串函数库 1.安装 2.   (1)strlen:获得字符串的字符长度   (2)substr:字符串截取       格式: string substr(string $var,      ...

  7. 物联网架构成长之路(39)-Bladex开发框架环境搭建

    0.前言 上一篇博客已经介绍了,阶段性小结.目前第一版的物联网平台已经趋于完成.框架基本不变了,剩下就是调整一些UI,还有配合硬件和市场那边,看看怎么推广这个平台.能不能挣点外快.第一版系统虽然简陋, ...

  8. 大话设计模式Python实现-观察者模式

    观察者模式(发布-订阅模式 Publish Subscribe Pattern):定义了一种一对多的关系,让多个观察对象同时监听一个主题对象,当主题对象状态发生变化时会通知所有观察者,是它们能够自动更 ...

  9. Visual Studio 语法高亮插件推荐

    编辑器 GItHub:https://github.com/Art-Stea1th/Enhanced-Syntax-Highlighting Visual Studio Marketplace:htt ...

  10. Kubernetes 弹性伸缩全场景解读(二)- HPA 的原理与演进

    前言 在上一篇文章 Kubernetes 弹性伸缩全场景解析 (一):概念延伸与组件布局中,我们介绍了在 Kubernetes 在处理弹性伸缩时的设计理念以及相关组件的布局,在今天这篇文章中,会为大家 ...