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> ...
随机推荐
- HTTP: 状态码200~505说明
HTTP状态码(HTTP Status Code) 一些常见的状态码为: 200 - 服务器成功返回网页 404 - 请求的网页不存在 503 - 服务不可用 所有状态解释: 1xx(临时响应) 表示 ...
- ImageField 字段的使用
Django模型中的ImageField和FileField的upload_to选项是必填项,其存储路径是相对于MEIDA_ROOT而来的.
- poj 3468: A Simple Problem with Integers (树状数组区间更新)
题目链接: http://poj.org/problem?id=3468 题目是对一个数组,支持两种操作 操作C:对下标从a到b的每个元素,值增加c: 操作Q:对求下标从a到b的元素值之和. 这道题也 ...
- webpack使用问题记录
1.版本问题 webpack的安装并不是越新越好.当使用最新版本时不使用配置文件,直接编译不生成文件甚至报错:使用3.12版本时编译文件可以成功但是不生成新文件:使用 3.5.3 版本时成功且生成新文 ...
- BUUCTF平台:RSA
RSA import gmpy2 def Decrypt(c,e,p,q): L=(p-1)*(q-1) d=gmpy2.invert(e,L) n=p*q m=gmpy2.powmod(c,d,n) ...
- LOJ 2555 「CTSC2018」混合果汁——主席树
题目:https://loj.ac/problem/2555 二分答案,在可以选的果汁中,从价格最小的开始选. 按价格排序,每次可以选的就是一个前缀.对序列建主席树,以价格为角标,维护体积和.体积*价 ...
- vue绑定属性、绑定class及绑定style
1.绑定属性 v-bind 或者 : 例如:<img :src="pic_src" /> <template> <div id="app& ...
- html标签<td><tr><th>全称及缩写说明
<td> 是table data cell 的缩写,单元格 <tr> 是table row 的缩写,表格中的一行 <th> 是table header cell 的 ...
- SQL学习记录:定义(一)
--1.在这里@temp是一个表变量,只有一个批处理中有效,declare @temp table; --2. 如果前面加#就是临时表,可以在tempDB中查看到,它会在最后一个使用它的用户退出后才失 ...
- Design:设计(活动)百科
ylbtech-Design:设计(活动)百科 设计是把一种设想通过合理的规划.周密的计划.通过各种感觉形式传达出来的过程.人类通过劳动改造世界,创造文明,创造物质财富和精神财富,而最基础.最主要的创 ...