摘要: 什么是代码使用率? 比如一个JS文件有100行代码,加载他的时候里面当前可能只有60行是直接能加载用到的,里面的另外40行比如说是click事件触发后的代码逻辑,显然,如果我们不点击,只是纯属浏览,那么这40行代码就白白加载了,因为用不到啊,所以总体来说这个文件的代码使用率就是60%。 但是呢?如果 阅读全文
posted @ 2021-02-14 21:03 猎奇游渔 阅读(85) 评论(0) 推荐(0) 编辑
摘要: 1. npm i @xxx 安装这种有带有@的包时候:提示报错 解决方法:只需要把有@的那部分用引号包起来即可完成安装 2.当遇见npm i 下载依赖失败的时候: 1.删除原有的node_modules,重新npm i rm -rf node_modules 2.切换下载源 nrm use 源 3. 阅读全文
posted @ 2021-02-14 19:58 猎奇游渔 阅读(1509) 评论(0) 推荐(0) 编辑
摘要: https://github.com/webpack/analyse 在命令行中加上 --profile --json > stats.json 运行npm run bundle,会在根目录生成一个json文件,这个文件中包含了此次打包的所有信息 看这个json文件我们肯定看不懂,我们可以用官方推荐 阅读全文
posted @ 2021-02-14 19:24 猎奇游渔 阅读(534) 评论(0) 推荐(0) 编辑
摘要: 我们在入口文件index.js中引入lodash,执行一个方法: 运行发现打的包是2.2MB了,很大,因为这样引入是把lodash全部引入了,体积很大 我们想要的是,像是引入的第三方库我们不想每次打包的时候重新去加载,我们只打包自己的业务逻辑代码,第三方库我们让浏览器缓存,运行的时候直接拿缓存。 1 阅读全文
posted @ 2021-02-14 18:38 猎奇游渔 阅读(300) 评论(0) 推荐(0) 编辑
摘要: 一、基于配置文件方式配置 我们想要做的就是打包时候可以开发和生产配置不同的配置文件去打包: webpack.dev.js 和webpack.prod.js 在package.json中配置对应这两种的打包运行命令以及本地便于开发调试的dev-server 接着,我们把原来的webpack.confi 阅读全文
posted @ 2021-02-14 16:34 猎奇游渔 阅读(167) 评论(0) 推荐(0) 编辑
摘要: webpack2.x开始支持 tree shaking概念,顾名思义,"摇树",只支持ES module的引入方式(ES6)!!!! 这个方法就是在生产模式下打包出的index.js文件不会把没有使用到的模块给打包进去。从而减少代码体积。 就是会对入口文件index.js 进行检测,没有使用到的就不 阅读全文
posted @ 2021-02-14 04:16 猎奇游渔 阅读(223) 评论(0) 推荐(0) 编辑
摘要: Babel处理ES6 官方网站:https://babeljs.io/ 安装:npm i babel-loader @babel/core @babel/preset-env -D //babel-loader是webpack 与 babel的通信桥梁,不会做把es6转成es5的工作,这部分工作需要 阅读全文
posted @ 2021-02-14 03:19 猎奇游渔 阅读(504) 评论(0) 推荐(0) 编辑