webpack第一节(4)
每次修改了代码都需要重新手动打包,这样很麻烦,不符合webpack的初衷,我们查看webpack帮助看看有没有可以自动运行的方法
输入 webpack -help
可以发现有个 --watch方法 它的解释是监听系统文件改变 我们试一试
现在监听进程一直在运行 我们改变 css的背景颜色为yellow 刷新页面 背景是黄色
每次我们引入css 都要添加css-loader 和style-loader 很麻烦 webpack提供了用命令方式
因为watch 还在继续 我们按Ctrl+c终止监听 输入Y 终止
我们的loader css 加载用这个命令
hello.js中修改引入css的方式
写入命令
会发现效果 跟之前的是一样的 可以打包成功
然后我们用 --watch 合并起来
webpack 还有很多的命令 可以看看文档 对了解webpack很有帮助
webpack第一节(4)的更多相关文章
- webpack第一节(1)
跟着慕课网的老师做了下笔记 webpack是一个前端打包工具 它可以优化网页.例如 页面模块化加载.图片优化.css.js压缩等等. 模块化加载也就是懒加载,按需加载,以前的模式是所以得css写在一起 ...
- webpack第一节(3)
模块化加载 上一节进行了一个简单的模块化加载,复杂点 新建一个js文件 名为 world.js 依旧在根目录下 在hello.js中引入world.js 模块化加载,world.js是一个模块 引入的 ...
- webpack第一节(2)
安装webpack在文件夹中 安装完成如图所示 牛刀小试 在webpack-test根目录下新建一个hello.js (不新建在node-modules文件夹下面的目的是,该文件夹是webpack的依 ...
- Ext JS学习第十六天 事件机制event(一) DotNet进阶系列(持续更新) 第一节:.Net版基于WebSocket的聊天室样例 第十五节:深入理解async和await的作用及各种适用场景和用法 第十五节:深入理解async和await的作用及各种适用场景和用法 前端自动化准备和详细配置(NVM、NPM/CNPM、NodeJs、NRM、WebPack、Gulp/Grunt、G
code&monkey Ext JS学习第十六天 事件机制event(一) 此文用来记录学习笔记: 休息了好几天,从今天开始继续保持更新,鞭策自己学习 今天我们来说一说什么是事件,对于事件 ...
- android内部培训视频_第一节
声明:本视频为公司内部做android培训时录制的,无任何商业目的.同时鉴于水平有限,可能不符合您的需求,放在这里的目的是提供给公司同事下载,作为培训的一个记录,也作为一个系列教程的自我督促完成的理由 ...
- 我的第一节Android课
我的第一节安卓课程,今天非比寻常的一天,我开始了我程序猿之路的第一节安卓课程,安卓课程只是我的一个兴趣班,我的本专业是java开发,因为喜欢做一个属于自己的一个手机APP,就选多个一样技能,毕竟十八般 ...
- 第四章 跨平台图像显示库——SDL 第一节 与SDL第一次亲密接触
http://blog.csdn.net/visioncat/article/details/1596576 GCC for Win32 开发环境介绍(5) 第四章 跨平台图像显示库——SDL 第一节 ...
- Centos7 Openstack - (第一节)基本环境配置
Centos7 install Openstack - (第一节)基本环境配置 我的blog地址:http://www.cnblogs.com/caoguo 根据openstack官方文档配置 官方文 ...
- seajs第一节,seajs基本使用
什么是seajs,它是干什么使用的,可以去网上搜索一下, 官网:http://seajs.org/docs/ 基本使用seajs <!DOCTYPE html> <html> ...
随机推荐
- Jquery datatable 配置与应用
var EcommerceOrders = function() { var initPickers = function() { //init date pickers $('.date-picke ...
- 前端每日实战:67# 视频演示如何用纯 CSS 创作单元素点阵 loader
效果预览 按下右侧的"点击预览"按钮可以在当前页面预览,点击链接可以全屏预览.https://codepen.io/comehope/pen/YvBvBr 可交互视频 此视频是可以 ...
- Python格式输出汇总
print ('%10s'%('test')) print ('{:<10}'.format('test'))#left-aligned print ('{:>10}'.format('t ...
- python 列表使用
下面实现的类似于java中的数组: names[-2]表示实现倒数的第2个参数 names[-3,-1]表示实现-3到-1的值不包含-1 增删改查 下面代码实现列表的增删改查功能: 复制copy 深c ...
- js 属性getset
属性访问器 一.像C#写实体类一样的写法 var attr={ $x:10,//必须$开头 get x() { return this.$x+1; }, set x(val) { this.$x=va ...
- Nmon监控服务端性能
一.安装1.查看服务器操作系统的版本信息 lsb_release -a cat /etc/*release2.下载 a.nmon下载地址:http://nmon.sourceforge.net/pmw ...
- 十条服务器端优化Web性能的技巧
服务器 远程桌面连接工具 提高web应用的性能从来没有比现在更重要过.网络经济的比重一直在增长;全球经济超过5%的价值是在因特网上产生的(数据参见下面的资料).这个时刻在线的超连接世界意味着用户对其 ...
- PHP curl_escape函数
curl_escape — 对给定的字符串进行URL编码. 说明 string curl_escape ( resource $ch , string $str ) 该函数对给定的字符串进行URL编码 ...
- 4412 GPIO读 和 ioremap控制GPIO寄存器
一.配置GPIO读 在视频14的基础上做 1.利用拨码开关来实现GPIO输入 所以AP_SLEEP对应GPC0_3,然后在drivers/gpio/gpio-exynos4.c中对应EXYNOS4_G ...
- 【Linux】清理缓存buffer/cache
运行sync将dirty的内容写回硬盘 sync 通过修改proc系统的drop_caches清理free的cache echo 3 > /proc/sys/vm/drop_caches ech ...