随笔分类 -  webpack

webpack之代码分割及页面缓存优化
摘要：概述 使用webpack进行打包时，会生成默认的入口文件chunk、chunk-common、default包。这些chunk包会随着项目的不断增大而增大， 有时我们只修改一行代码就需要重新构建所有包，并且页面也无法做到按需加载(chunk包)，首页就需要加载到所有(chunk包)。 我们可以通过配 阅读全文
posted @ 2020-08-10 10:15 落叶&不随风 阅读(623) 评论(0) 推荐(0)
webpack之常用loader的配置和使用
摘要：概述 loader解析器主要用于预处理项目代码，并最终转换为可打包的文件格式（js,css,标准资源文件等） 常用的几个Loader babel-loader 参考文档 主要用于在旧的浏览器或环境中将 ECMAScript 2015+ 代码转换为向后兼容版本的 JavaScript 代码(摘抄自ba 阅读全文
posted @ 2020-07-29 15:46 落叶&不随风 阅读(848) 评论(0) 推荐(0)
webpack之常用plugin的配置和使用
摘要：概述 webpack中的插件主要是用来完成loader和配置无法完成的事情 常见的几种Plugins HtmlWebpackPlugin 参考文档 html-webpack-plugin插件默认会创建一个HTML模板，并自动引入打包生成的几个主要的chunk包 也可以通过template属性配置自己 阅读全文
posted @ 2020-07-28 18:31 落叶&不随风 阅读(3040) 评论(0) 推荐(0)
webpack之主要部分Entry、Output、Loaders、Plugins说明
摘要：简述 webpack的主要组成部分，Entry、Output、Loaders、Plugins Entry(入口) webpack开始解析关联资源的入口文件 单个入口可以直接使用字符串 多个入口可以使用对象进行设置 使用字符串配置时，默认chunkName(key)为main // 单个入口 cons 阅读全文
posted @ 2020-07-27 16:50 落叶&不随风 阅读(270) 评论(0) 推荐(0)
webpack之调试工具devServer（webpack-dev-server）的使用和配置
摘要：简述 开发中会频繁的手动构建和刷新页面，十分繁琐 这些功能我们完全可以使用webpack-dev-server插件来代替实现 作用 使用node(express)创建服务，挂载打包文件，可以使得我们在浏览器上直接预览，（打包后的文件直接存放在内存中，不会生成文件，当然我们可以在页面上查看） 监听文件 阅读全文
posted @ 2020-07-23 15:58 落叶&不随风 阅读(2795) 评论(0) 推荐(0)
webpack安装、环境搭建和基本配置
摘要：安装 $ npm install -D webpack $ npm install -D webpack-cli # or use yarn $ yarn add -D webpack 如果需要在命令行运行，还需要全局安装 配置文件 默认使用当前目录下的配置文件 webpack.config.js 阅读全文
posted @ 2020-07-23 10:19 落叶&不随风 阅读(431) 评论(0) 推荐(0)
webpack知识点总结
摘要：最近抽时间学习了一下webpack的配置和使用，居然花了我足足八天时间，也算入门了。 用几篇文章简单记录一下学习历程和总结，主要包括以下几个部分（部分已开启传送门）： webpack的安装、配置、执行等基本使用； webpack之调试工具devServer（webpack-dev-server）的使 阅读全文
posted @ 2020-07-22 19:01 落叶&不随风 阅读(301) 评论(0) 推荐(0)