前言

由于多个中后台系统做前后端分离，各个业务模块集合在一个项目里面开发会造成后期不好维护且容易出问题，也不方便独立部署。
所以需要设计一套高度解耦又聚合在一个平台方便管理的系统架构。

前言

基于Vue-CLI v4版本构建的SPA项目改造成VueSSR服务端渲染项目。

背景

前段时间对网站项目进行了大的架构重构，上线已经半年了。一直想分享Vue-SSR项目架构，但是一直在忙SSR网站的架构优化迭代。
首先说一下做SSR项目重构的项目目的是什么

1. 更全面的SEO优化
2. 网站首屏渲染性能优化
3. 项目可维护性优化
4. 项目高可用性优化

前言

现在前端cli工具已经比较成熟，而且用的也很方便，但是最近又出现了比’Vue Cli’更高纬度的下一代前端工具|尤雨溪新品Vite的魔力。
这些工具的出现是为了解决 ES Modules 模块系统本身的环境兼容问题、以及零散的模块文件导致的频繁网络请求发送和模块化发散的问题等等。
既然已经有了 Webpack，尤大再整一个 Vite 到底有啥用呢？

前言

有时候在某些开发场景必须需要用到https安全环境来测试，比如FB的登录sdk调试，FB的App Links，PWA的调试等等。那我们就需要搭建一个https安全环境,这种情况我有两种解决方案。

1. 用mkcert本地生成免费安全证书
2. 去七牛云或者阿里云白嫖免费安全证书

第1种本地生成的证书只能在自己电脑上信任证书来确保https安全环境为绿色，在其他设备上会显示https不安全。
要使用公网认证的https就用第2种方式，去白嫖SSL安全证书，第2钟方式要有几个前提条件

• 自己拥有ECS云服务器（这个阿里与好像也有能白嫖的低配机器）
• 自己拥有一个域名（去阿里云购买非特殊域名也不贵几块钱一年）
• 注册七牛云账户去0元购买SSL免费证书
• 还有就是你需要基本熟悉Linux操作命令

我下面主要介绍第2种方案，想要实现第1种方案的可以去查看mkcert的文档

前言

简单介绍使用node-rsa模块生成/导出秘钥,加密/解密,签名/验证

具体方法见API

介绍

特点

• 解决单页面应用(SPA)的SEO配置问题
• 拥有可控的服务端中间件功能，服务端重定向，服务端打cookie等
• 可在服务端根据前端需要组装数据供首屏渲染使用
• 可方便开发AMP页面，并跟vue打包资源同时发布又区分明确的静态资源
• 一键集成PWA功能，附带可用的pwa配置
• 方便vue多页面入口配置，及打包资源分析等等

前言

Express+Vue+AMP搭建node服务端注入首屏渲染数据, Express+ejs组装AMP组件的项目架构
我做过的某个项目经历过以下5个项目架构形态

1. Vue+PHP CI
2. Vue+Nginx
3. Vue+PHP
4. Vue+Express
5. Express+Vue+AMP+PWA

具体架构变动看下面的思维导图

前言

之前一直说Steve Jobs是自己的偶像，但是自己真的了解他吗？知道他经历过什么吗？知道他是什么性格的人吗？不知道！之前只看到他的光辉，只知道他创建了苹果公司，只知道他重新定义了智能手机，只知道他发布的所有苹果产品都那么完美。然而根本就不知道他是怎么做到的！

前言

前段时间看到项目里面的货币符号和金额转换的Vue 全局过滤器，感觉这样实现一点都不优雅，而且存在不完善，不统一的问题。比如每次都需要实时算，每次切换货币要强刷页面重新加载。然后就想到了vue-i18n这个vue官方插件，多语言国际化，他是怎么做到不刷新页面切换语言的？于是就去观摩vue-i18n的源码，然后我就参考vue-i18n写了一个vue-l10n的货币转换本地化的Vue插件。

前言

这次主要是对打包文件 chunk-vendors文件拆包，和 chunk-common提取通用chunk 里面的多语言包进行分语言环境懒加载。
要做这这些事情，需要先了解以下内容：

• Webpack打包分析工具 webpack-bundle-analyzer
• Vue i18n 延迟加载翻译包
• WebpacksplitChunks 根据主要常用的npm库拆分
• Vue-cli3多页面入口配置
• WebpackdllPlugin预构建配置