Webpack
浮沉半生
从事前端开发,喜欢探究源码,研究新技术。
展开
-
Webpack 的简单介绍
本文介绍了一些 webpack 的核心概念以及一些概念术语,并对核心配置做了一些简单的用法讲解。建议刚刚接触 Webpack 的朋友可以先了解一下。想了解更多 Webpack 使用以及配置的话可以参考我的下一篇文章: 从零开始搭建一个 Webpack 开发环境配置(附 Demo)为什么需要使用 webpack模块化开发的趋势我们在开发的过程中,之前都是使用引入 script 的方式进行...原创 2019-02-01 17:22:05 · 386 阅读 · 0 评论 -
从零开始搭建一个 Webpack 开发环境配置(附 Demo)
本文使用 Webpack 从零开始搭建一个开发环境的脚手架配置,在此做个记录,也方便以后使用。前言我的上一篇文章简单介绍了一下 Webpack 的一些核心概念和基本配置,需要了解的朋友可以先参考一下:Webpack 的简单介绍从 webpack v4.0.0 开始,可以不用引入一个配置文件。直接使用 webpack 命令就可进行打包。但是,一般我们需要进行更灵活的配置功能,所以本文我也创...原创 2019-02-02 10:40:58 · 1128 阅读 · 2 评论 -
使用 Webpack 进行生产环境配置(附 Demo)
本文从代码压缩、代码拆分、样式分离等三个方面对生产环境的代码进行了优化。只是最简单的一些配置,如果真正运用到项目中,还需要根据项目添加更多配置。前言本文讲述的是如何对生产环境下的代码进行压缩,如果还不是太了解 Webpack 的朋友,可以先看一下我的上一篇文章:从零开始搭建一个 Webpack 开发环境配置(附 Demo)本文项目代码位置:源码地址环境搭建项目结构首先编写一个项目,...原创 2019-02-15 14:56:04 · 431 阅读 · 0 评论 -
使用 Webpack 的 DllPlugin 提升项目构建速度
本文介绍了 Webpack 中 DllPlugin 插件的使用,以及配合使用 AddAssetHtmlPlugin 将构建好的 JS 文件插入到 html 页面中。本文 Demo 地址本文项目代码位置:源码地址欢迎 Star!DLLPlugin 和 DllReferencePlugin 简介DLLPlugin 就是将包含大量复用模块且不会频繁更新的库进行编译,只需要编译一次,编译完成...原创 2019-02-18 10:58:55 · 627 阅读 · 0 评论 -
使用 happypack 提升 Webpack 项目构建速度
本文简单介绍了 Happypack 的简单使用,不了解的同学可以进来看一看。也许会有所帮助。Happypack 作用在使用 Webpack 对项目进行构建时,会对大量文件进行解析和处理。当文件数量变多之后,Webpack 构件速度就会变慢。由于运行在 Node.js 之上的 Webpack 是单线程模型的,所以 Webpack 需要处理的任务要一个一个进行操作。而 Happypack 的作...原创 2019-03-05 10:59:28 · 18322 阅读 · 2 评论 -
Webpack3 升级到 webpack4 时遇到的问题汇总
项目在对 webpack 的版本升级的过程中,出现了各种各样的问题,今天就把其中比较典型的问题总结一下,作为记录。一、MissingDeps.some is not a function错误提示中,提示 react-dev-utils 包有问题,TypeError: MissingDeps.some is not a function。解决方案:升级 react-utils-dev 包到...原创 2019-04-04 10:48:59 · 1394 阅读 · 0 评论 -
从零开始搭建一个 React + Mobx + React Router 脚手架
本文详细介绍了如何从零开始搭建一个 React 开发的脚手架,包含如何添加 Redux 以及 React Router 的环境。本文代码地址:react-mobx-starter。建议将代码拉下来之后,配合本文一起查看,效果更佳。代码下载命令:git clone https://github.com/beichensky/react-mobx-starter.git最近将脚手架中的 ...原创 2019-04-30 12:56:25 · 929 阅读 · 2 评论