![](https://img-blog.csdnimg.cn/20201014180756925.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
打包工具
文章平均质量分 87
寂寞花如雪
白茶清欢无闲事,我在等风也等你
展开
-
如何更好的进行webpack的打包优化
在前面的一篇文章里提到了,现有项目的升级,但升级结束并不意味这整个任务的结束。还有针对项目打包速度的提升,当一个vue的项目页面在200以上的时候,这个打包速度就会大幅度的降低。那么针对webpack的打包优化就是一件不得不做的事情了,webpack打包优化分为两部分,一部分是大小优化,另一部分是速度优化。大小优化1.Externalswebpack 提供Externals的方法,可以通过外部引用的方法,引入第三方库: index.html<script src="https://code.原创 2021-01-29 13:30:44 · 481 阅读 · 2 评论 -
记录一次vue-cli2下的webpack3.x升级webpack4.x的历程
目录写在前面的话安装 webpack-cli ,升级webpack重新安装node包升级webpack-dev-server至3.X升级html-webpack-plugin升级vue-loader增加VueLoaderPlugin插件代码安装babel-plugin插件转换es6代码。同时安装webpack webpack-dev-server webpack-cli写在前面的话由于公司项目是19年创建的,因此还是基于vue/cli2搭建的,webpack版本也是3.6.0。(当时有vue/cli3和原创 2021-01-14 11:00:48 · 1008 阅读 · 3 评论 -
使用gulp解决小程序代码包过大问题
前言在开发小程序项目的过程中,由于功能的不断增加导致了代码包体积的越来越大。相对其体积进行一下压缩处理,看了几篇给小程序瘦身的博客,决定给自己的项目做一套配置文件,使用gulp来支持小程序文件的编译以及上传之前压缩文件的空行之类的。通过gulp实现代码处理,要进行一些必须文件的配置,放在小程序根目录下,然后将小程序的所有文件移至src下。gulpfile.js – 使用了插件功能,支持gulp开头的插件const gulp = require('gulp')const SRC_DIR = '原创 2021-01-06 11:49:41 · 531 阅读 · 1 评论 -
打包神器webpack的一键式操作
创建基本的webpack4.x项目运行npm init -y 快速初始化项目在项目根目录创建src源代码目录和dist产品目录在 src 目录下创建 index.html使用 cnpm 安装 webpack ,运行cnpm i webpack webpack-cli -D如何安装 cnpm: 全局运行 npm i cnpm -g注意:webpack 4.x 提供了 约定大于配置...原创 2019-08-19 08:31:36 · 510 阅读 · 1 评论 -
打包神器的gulp必备导航
1.关于gulpgulp 是基于 node 实现 Web 前端自动化开发的工具,利用它能够极大的提高开发效率。在 Web 前端开发工作中有很多“重复工作”,比如压缩CSS/JS文件。而这些工作都是有规律的。找到这些规律,并编写 gulp 配置代码,让 gulp 自动执行这些“重复工作”。2.安装 Node 和 gulpgulp 是基于 node 实现的,那么我们就需要先安装 node。...原创 2019-08-18 14:39:01 · 350 阅读 · 1 评论