《玩转Webpack》学习笔记Day7之第三章(下)34-37讲

97 阅读1分钟

接上一章

Webpack ssr打包存在的问题

浏览器的全局变量(Node.js中没有 document,window)

  • 组件适配: 将不兼容的组件根据打包环境进行适配

  • 请求适配: 将fetch或者ajax发送请求的写法改成isomorphic 或者 axio 样式问题(Node.js 无法解析css)

  • 方案一 服务端打包通过ignore-loader忽略掉CSS的解析

  • 方案二 将style-loader替换成isomorphic-style-loader

image.png

35讲

如何解决样式不显示的问题?

使用打包出来的浏览器端html为模版 设置占位符,动态插入组件

image.png

首屏数据如何处理?

服务端获取数据 替换占位符

image.png

36讲 优化构建时命令行的显示日志

当前构建时的日志显示

展示一大堆日志,很多并不需要开发者关注

统计信息stats

image.png

如何优化命令行的构建日志

image.png

image.png

37讲 构建异常和中断处理

如何判断构建是否成功

在CI/CD的pipline或者发布系统需要知道当前构建状态 每次构建完成后输入echo$?获取错误码

构建异常和中断处理

image.png

如何主动捕获并处理构建错误

image.png

参考

程柳锋 《极客时间》《玩转webpack》34-37讲