由于 vue3.2 版本的发布，`<script setup>` 的实验性标志已经去掉，已经陆陆续续有不少公司开始使用 `vue3.2`开发项目了。这篇文章就来帮助大家如何快速使用 `vue3.x`

项目初始化ts配置项tsconfig.json目前暂时采用项目构建后的默认配置shim.d.ts配置解决找不到.vue模块的报错问题参考https://juejin.cn/post/688923917

先过一遍webpack对代码分割功能的实现方式：多入口分割：entry防止重复：使用Entrydependencies或者SplitChunksPlugin去重和分离chunk。动态导入：使用esmo

webpack官网中，有这么一句话，我不是很认同： 可以说，性能优化最重要的部分就是懂得如何分包了。因此，就来谈谈webpack中的分包。

1. 概述 从我们接触前端开始，每个项目的根目录下一般都会有一个package.json文件，这个文件定义了当前项目所需要的各种模块，以及项目的配置信息（比如名称、版本、许可证等）。 当运行npm i

我们在之前的文档中了解到，目前的微前端采用的是组合式应用路由分发。通过父类对路由的检测，动态的对子应用进行卸载或挂载。 在咱们理解原理之前，先看一下如何使用single-spa。我们以vue为例。 首

本文则是在此基础上对现有的微前端解决方案进行对比总结，废话少说，让我们开始今天的课题。 众所周知，iframe是html提供的标签，能加载其他web应用的内容，并且它能兼容所有的浏览器，因此，你可以用它来加载任何你想要加载的web应用。 iframe最大的特性就是提供了浏览器原…

当浏览器截获到一个页面请求后，将会按照顺序做如下图所示的4件事。 首先会将所有需要加载的资源进行分类。 然后根据浏览器相关的安全策略，来决定资源的加载权限。 接着对各个资源的加载优先级进行计算和排序。 最后一步，根据加载优先级顺序来加载资源。 chrome浏览器会将资源分为14…

2021年再谈 webpack 项目搭建，保姆级教程，手把手带你搭建 webpack5 + ts + vue3 的企业级项目开发环境