Webpack
-
什么是模块热替换?
模块热替换(HMR - hot module replacement)功能会在应用程序运行过程中,替换、添加或删除 模块,而无需重新加载整个页面。 主要是通过以下几种方式,来显著加...
-
npm打包时需要注意哪些?如何利用webpack来更好的构建?
Npm是目前最大的 JavaScript 模块仓库,里面有来自全世界开发者上传的可复用模块。你可能只是JS模块的使用者,但是有些情况你也会去选择上传自己开发的模块。 关于NPM模块...
-
怎么配置单页应用?怎么配置多页应用?
单页应用可以理解为webpack的标准模式,直接在entry中指定单页应用的入口即可,这里不再赘述多页应用的话,可以使用webpack的 AutoWebPlugin来完成简单自动化...
-
如何提高webpack的构建速度?
1.多入口情况下,使用CommonsChunkPlugin来提取公共代码 2.通过externals配置来提取常用库 3.利用DllPlugin和DllReferencePlugi...
-
webpack的构建流程是什么?从读取配置到输出文件这个过程尽量说全
Webpack 的运行流程是一个串行的过程,从启动到结束会依次执行以下流程: - 1.初始化参数:从配置文件和 Shell 语句中读取与合并参数,得出最终的参数; - 2.开始编译...
-
有哪些常见的Plugin?他们是解决什么问题的?
define-plugin:定义环境变量 commons-chunk-plugin:提取公共代码 uglifyjs-webpack-plugin:通过UglifyES压缩ES6代码
-
有哪些常见的Loader?他们是解决什么问题的?
- file-loader:把文件输出到一个文件夹中,在代码中通过相对 URL 去引用输出的文件 - url-loader:和 file-loader 类似,但是能在文件很小的情况...
-
与webpack类似的工具还有哪些?谈谈你为什么最终选择(或放弃)使用 webpack?
同样是基于入口的打包工具还有以下几个主流的: - webpack - rollup - parcel 从应用场景上来看: - webpack适用于大型复杂的前端站点构建 - rol...
-
webpack与grunt、gulp的不同?
三者都是前端构建工具,grunt和gulp在早期比较流行,现在webpack相对来说比较主流,不过一些轻量化的任务还是会用gulp来处理,比如单独打包CSS文件等。 grunt和g...
-
webpack打包减小打包体积,怎么优化
1)去掉不必要的插件 开发环境和生产环境使用同一个webpack配置文件,导致生产环境打包的js文件包含很多没必要的插件(如:NoEmitOnErrorsPlugin) 2)提取第...
-
loader 和 plugin 的区别是什么
loaders 是加载器。用来处理源文件的(JSX,Scss,Less..),一次处理一个,让 webpack 有能力加载处理非js文件,plugin 是插件。并不直接操作单个文件...
-
有哪些常见 loader 和 plugin,你用过哪些
loader: - css:postcss-l+autoprefixer,style-l(js到 ),css-l(js中 import 的 css),less-l,sass-l -...
-
如何按需加载代码
import('文件路径').then【代码执行到时再加载】
-
如何提高 webpack 构建速度
- 用 webpack4 - 用 externals 提取常用库 - 提前打包第三方库:dllplugin - happypack:多线程进行打包,提升 loader 解析速度 -...