欢迎来到我的小宇宙

Nuxt.js （day2） 的学习 #前一天刚把 Nuxt 的页面、接口和 SQLite 跑起来，今天就顺势开始折腾部署。因为这个项目本身已经具备前后端和数据库的最小闭环，所以很适合拿来练习一次完整的上线流程。 这篇主要记录我在部署 Nuxt 项目时最终采用的方案、实际踩过的坑，以及排查 Nginx、Cloudflare 和 better-sqlite3 过程中得到的一些结论。整体折腾了小半天，最后算是把从容器启动到域名访问这一整条链路搞通了。感谢 GPT,感谢我的同事哈哈！ 最终我决定统一采用这套方案： Docker 里只运行 Nuxt 宿主机 Nginx 负责对外入口 宿主机 Nginx 反向代理到 127.0.0.1:3000 一、我最终采用的部署方式 #最后确定使用的是这套部署流程：

Nuxt.js （day1） 的学习 #最近看到一个新技术就折腾一下，前面看到 qiankun，昨天刷 L 站看到了 Nuxt.js，这不就开始上手边看文档边写项目了。 目前就根据我自己起的项目来做个小总结。 1. 项目结构 #目前跟普通的 Vue 的区别就是多了一个 server，专门用于放与后端 db、api 相关的内容，其他的没太多变化。

其实在最初找工作的时候就跟一些同为前端的朋友交流过，那个时候了解到的一个概念是叫“大前端”，当时其实是有点懵的，刚毕业感觉自己什么都不会，这个概念也是第一次听到，后面了解到的就是前端不仅仅只是做web开发。还需要涉及更多领域，比如说微信小程序，APP,桌面端（Electron），甚至是 Node.js,SSR 这种。后面上班后视野逐渐更加开阔，了解到了一点点 docker 的皮毛，熟悉了 nginx等这种工程化的内容。对于这个大前端也有了一定的概念。 随着工作时间的增加，偶然看到了微前端的这个概念。这个虽然在之前也听过，可是我并没有去了解，但是今天我在空闲的时间中，依靠如今的 AI 帮我做了一个深入的了解。我让 AI 帮我搭建了一个基础的项目框架，然后我看了一下它写的代码，大概就了解了这个概念。微前端无非就是一个大容器中我可以随时放任何内容，想放哪个就放哪个，不要哪个就拿出来即可。且这些内容可以由多个不同的人来开发。彼此之间不会受到任何干扰。这大概就是我所了解到的。虽然可能看起来比较浅显。但是我想应该就是这样了。 下面我输出一些基础的代码来看看 #首先是主应用，也就是所谓的放子应用的容器,其实就是一个独立的 Vue3 项目 App.vue中的核心部分是这样的 #<template> <div> <nav style="padding:10px;background:#f0f0f0"> <a href="/sub-vue">Vue3 Sub</a> | <a href="/sub-react">React Sub</a> | <a href="/sub-vanilla">Vanilla Sub</a> </nav> <div id="subapp-container"></div> </div> </template> 因为我初识这个微前端，搭建的内容可能简单粗浅。这个地方可以看到我有三个子应用，我选择了 vue, react, 和原生的 js. 这个地方的重要点是 a 链接中的 href 和下面 div 中的 id,这些内容需要跟在主应用中注册微应用中的内容对上,记得需要在 main.js 中需要引入前端和对应用进行注册。

背景 #昨天在公司写完项目后，本来就是一个很正常的新增一个接口，然后修改 nginx，然后部署项目，但是出现了一个非常奇怪的事情。我的接口居然出现 403，报错还是 vite ???? 可是我已经部署了怎么可能还报错 vite 的问题呢???? Vite 跨域配置 #以下是我的 vue3 代码的 vite的跨域配置，其实就是端口号不一样，所以我就参考了之前写的 Botapi，nginx 也是这样写的。

这段时间跟同事一起做开发时，总是碰到分支起冲突，我去请教 AI 时，他给了我这样的一套命令，git stash,git pull,git stash pop,这个 pull 是了解的，但是剩下两个是什么呢？为什么能这样避免冲突呢？于是我就去搜索答案，发现 git stash 可以做三件事情， 保存当前修改（tracked 文件） 清空工作区 让你可以安全切分支 然后这个git stash pop命令是把最近一次 stash 的修改恢复到当前工作区，并且从 stash 列表里删除它。 我们来看看一个完整的使用流程 ## 开发中 git status # 临时保存 git stash push -m "WIP: payment module" # 切分支 git checkout main # 修 bug git commit -am "hotfix" # 切回来 git checkout dev # 恢复修改 git stash pop 那其实有点好奇这个 stash 是存在哪里的，本质是什么？ # 存在 .git 目录里 实际是一个特殊的 commit 存在一个栈结构里 但是这种方法不是建议经常使用，很容易造成忘记这回事，最开始我用的时候没有执行最后一步 git stash pop 时吓了一跳，怎么我自己的修改全部不见了。后面才知道是少执行了一步，这也确实暴露了自己的不足。