最近做的这个项目webpack用的是1.X的版本,真的非常多的坑,然后最近在疯狂的做优化: 事情的起因是每次我npm run dev的时侯都需要5分钟+,这个速度真的是难以忍受,然后就尝试去做项目的优化. 首先引入了webpack-bundle-analyzer来分析项目的包大小,于是发现有些文件真的大到难以忍受.先讲下这个插件怎么用: 1.先安装: 我平时都喜欢用yarn add来安装确实比npm i 的速度快 npm install --save-dev webpack-bundle-ana…

1. 前言 关于webpack,相信现在的前端开发人员一定不会陌生,因为它已经成为前端开发人员必不可少的一项技能,它的官方介绍如下: webpack 是一个模块打包器.webpack的主要目标是将 JavaScript 文件打包在一起,打包后的文件用于在浏览器中使用,但它也能够胜任转换(transform).打包(bundle)或包裹(package)任何资源(resource or asset). 在日常开发工作中,我们除了会使用webpack以及会编写它的配置文件之外,我们还需要了解一些关于…

前言 公司目前现有的一款产品是使用vue v2.0框架实现的,配套的打包工具为webpack v3.0.整个项目大概有80多个vue文件,也算不上什么大型项目. 只不过每次头疼的就是打包所耗费的时间平均在一分钟左右,而且打包后有几个文件显示为[big],也就是文件体积过大. 最近就想着捣鼓一下,看能不能在此前的基础上做一些优化,顺带记录下来分享给大家. webpack打包优化 关于webpack的打包优化一般会从两个方面考虑:缩短打包时长和降低打包后的文件体积,这两个方面也刚好是前面我需要解决的…

Vue 提供了一个官方的cli,为单页面应用 (SPA) 快速搭建繁杂的脚手架. 一.vue cli脚手架 脚手架通过webpack搭建开发环境 使用ES6语法 打包压缩js为一个文件 项目文件在环境中编译,而不是浏览器 实现页面自动刷新   基于nodejs和npm,可以在控制台输入node -v 或node --version查看node.js是否安装好以及npm -v查看是否安装好,安装好则会有本版提示.   另外分享几个npm的常用命令 npm -v #显示版本,检查npm 是否正确安装…

webpack优化 -- compression-webpack-plugin 开启gzip 打包的时候开启gzip可以大大减少体积,非常适合于上线部署.下面以vue-cli2.x项目为例,介绍如何在vue中开启gzip.…

webpack优化 -- happypack 前言:happypack是一个可以开启多线程转换loader的插件,可以在开发环境下提高编译速度,下面用vue-cli 2.x配合happypack优化一下vue项目.…

1. 错误npm ERR! code ERESOLVE 系统从win7升级到win10,之前的node版本是13.14.0,现在版本是16.17.1.正常的vue程序无法正常运行.从网上查询得知"node-sass": "^4.14.1"需要安装python2.7和vs_BuildTools,于是安装python2.7和visual C++2019,设置npm config set python C:\\Users\\Administrator\\.windows-…

node.js越来越热,应用的场景也越来越多. 但也因为是开源软件,所以具备大多数开源软件都存在的“版本问题”,版本发展很快,版本前后差异性大,老系统用新版本node跑不过,全局安装的第三方组件和node版本相关造成全局版本混乱. nvm是解决这一问题的利器. nvm是node版本管理工具,主要特点: 1.可安装多版本的node. 2.灵活切换当前的node版本. 3.以沙箱方式全局安装第三方组件到对应版本的node中. 4.通过.vnmrc文件,方便灵活地指定各应用系统所需的node版本进行运…

  安装一个支持windows切换node版本的工具 工作中我们可能需要用到一些工具,但这些工具依赖不同版本的node环境,那我们需要来为的切换node的环境吗, window msi安装的用户需要卸载重装的循环吗? 一切都变得很好,只是因为有了GNVM mac下直接安装 n 就可以了. 而坑爹的windows却未被支持 文章主要内容来自http://shalles.github.io/blog/tools/2015/04/27/windows-nodejs-version-controller…

之前一直使用的是node v2.2.0版本,挺说新版本的node解决了npm安装插件产生文件夹结构过深的问题,所以就想更新试试: 上网一看才发现,尼玛的node已经到了6.+版本了,好吧,看来还是得跟上节奏: 但是呢,怎么更新node就成了个问题,卸载重装? 这样又会出现一些配置的麻烦: 经过一番查找发现:可以使用 nvm 管理不同版本的 node 与 npm: nvm 是 Mac 下的 node 管理工具,有点类似管理 Ruby 的 rvm,如果是需要管理 Windows 下的 node,官方…