webpack
画不完的饼
只要肯努力,最坏的结果不过是大器晚成!
展开
-
webpack图片处理及图标字体配置
webpack图片处理webpack图片处理需要安装两个加载器:file-loader:把图片解析成一个文件输出出来。url-loader:把比较小的图片转换成base64.进行加载先通过命令安装一下:npm install file-loader url-loader -D安装完毕后,配置 webpack.config.js 》》》 module 》》》rules {...原创 2020-02-26 16:58:59 · 366 阅读 · 0 评论 -
webpack的loader加载器,文件压缩
webpack的loader加载器源码上传地址:链接: https://pan.baidu.com/s/1ihZuEGL62VcKy79-zE5pHQ 提取码: iquewebpack的loader是个加载器,其实是用来解析文件的。首先,我在src目录下,先创建一个css文件。index.cssdiv{ background:red;}然后将index.css引入到index.j...原创 2020-02-22 15:31:09 · 381 阅读 · 0 评论 -
webpack如何配置多入口多出口打包
webpack如何配置多入口多出口打包因为项目如果复杂的时候,入口肯定不止一个,下面来看,如何配置多个入口文件我们在src目录下面创建一个新的入口文件about.jsexport default (a,b)=>{ return a+b+666}来看一下我的目录结构:webpack.config.js改变entry的配置:entry:{ //定义入口文件index...原创 2020-02-21 17:29:19 · 6137 阅读 · 2 评论 -
webpack本地服务实现自动化
webpack本地服务实现自动化单入口打包项目,在上篇文章已经有所了解,但是在这之中,存在一个问题,每次我们的文件进行修改,都是需要重新打包的不然dist的内容依然是我们修改之前的内容。下面就开始如何实现webpack自动化打包浏览?1.我们需要借助一个包webpack-dev-server,创建一个本地服务器,自动重新构建包,并预览通过命令安装插件:npm install webpa...原创 2020-02-21 15:37:23 · 193 阅读 · 0 评论 -
webpack单入口手动配置打包
webpack的功能特点1.代码转换 2.文件优化 3.代码分割 4.模块合并 5.自动刷新 6.代码校验 7.自动发布webpack依赖如下两个模块ES5 module 模块:引入:import导出:exportcommon Js模块:引入:require导出:exportswebpack使用的是npm方式进行引入,导出首先需要创建一个目录src,新建两个js文件。第一步:...原创 2020-02-21 14:31:37 · 361 阅读 · 0 评论