看《深入浅出webpack》总结一下常用的webpack的属性的含义并加了一些自己的链接，写在一个文件下更能有全局感受，更能理解各个属性中间的关系，重点要关注entry,output,resolve,module, plugins几部分 这并不是一个拿来可用的配置，主要是为了更好理解常用的一些web...

简介读了《深入浅出webpack》总结一下常用的webpack的构建优化策略，可通过以下手段来提升项目构建时的速度 更精准的loader规则将loader规则写清楚仅让需要处理的文件，进入loader处理环节，如下rules:[{//正则尽量准确test:/.js$/,//使用缓存，缓存后在文件未改变时编译会...

一、打包分析1.1、速度分析我们的目的是优化打包速度，那肯定需要一个速度分析插件，此时 speed-measure-webpack-plugin 就派上用场了。它的作用如下：分析整个打包总耗时每个 plugin 和 loader 的耗时情况首先，安装插件npm...

最近在学习react框架，之前一直都是用vue 开发，知道在vue 中知道如何配置一下相关的webpack 有助于开发，学react 过程中，我也在想这些该怎么配置啊，所以就有这篇文章。这篇文章主要是讲react-create-app生成的项目利用react-app-rewire...

之前有用 webpack4与babel7改造基于vue-cli2生成的工程模板，介绍文章在此。之后通过一些实践，除去了cli工具相对复杂的配置结构，提供轻量化版本的配置方案。之所以说是轻量化，是相对于vue、react等框架提供的官方cli工具而言的。并不是说这些cli工具不好，它们本身提供了开箱即用的良好特...

所谓动态图片指的是接口返回的图片地址，这里的地址指的是本地的图片地址，而非网络图片的url。本地有一个image文件夹，存放需要用到的图片。按照接口返回的图片地址比对去加载。webpack加载图片首先想到的是file-loader或者url-loader   加载图片的配置首先安装file...

日常我们开发了一个库之后，如何打包之后提供给别人使用呢？如果你不清楚，就继续看吧！！！ mkdirlibrarycdlibrarynpminit-y经过以上步骤后会生成一个library文件夹，里面包含一个package.json文件。然后简单修改为如下所示：{"name":"library","versio...

Plugin(插件)是 webpack 生态的的一个关键部分。它为社区提供了一种强大的方法来扩展 webpack 和开发webpack的编译过程。这篇文章将尝试探索webpackplugin，揭秘它的工作原理，以及如何开发一个plugin。 关于Plugin的作用，引用...

webp是目前Web比较流行的解决方案，相对于Jpeg/png,基于VP8的压缩，有着非常不错的压缩率。<pliga'1,=""'onum'=""'kern'=""1;=""color:=""rgb(58,=""65,=""69);=""font-family:=""tahoma,="""helvetica=""...

1.升级到4.0之后未能正常使用处理：npm i webpack webpack-cliwebpack-dev-serverwebpack-merge-D 2. Error:Plugincouldnotberegisteredat'html-webpack-plugin...

前言在很久很久以前，在我们前端还只是页面切图仔的年代，我们开发一个html页面，通常会遇到这些情况：需要引入十几个css和js文件，而且因为他们彼此间有着依赖关系，所以引入的顺序还不能乱。传统的html+css+js开发方式不能不能很好地运用less/scss等css预处理器以及ES6+的高级语法。代码复用性差，可维护...

webpack和webpack-dev-server的区别第一，webpack是构建webpack-dev-server除了构建，还提供web服务 第二，webpack.config.js的路径参数区别entry都一样。ouput不太一样。path和webpack一起，构建后输出文件的位置，这是真实的物理地址...

gulp安装也正常，但是就是查看gulp-v的时候报错，原因：缺少系统变量PATH或者PATH变量错误提示：这个系统变量PATH，直接追加就好(多个变量值用分号;隔开)，不要删除已经有的系统变量PATH这个变量怎么找？有三种方法可以找到，或许还有其它方法可以找到，自己选择一种喜欢的方式就好（前提一定是全局安装过gulp...

1安装已安装npm前提下，先全局后在使用的文件夹下安装局部，npminit初始化package.jsonnpminstallwebpack--save-dev2测试     运行后生成b.js运行除了直接webpack命令，还可以修改package.json里面，在sc...

1、安装(windows)安了npm后，npminstallwebpack-g，全局位置在 C:UserslihaihongAppDataRoamingnpmode_modules 然后项目文件夹=>npminit#会自动生成一个package.json文件//自己写package.json就...