我们将完成ssr环境搭建

发表于 2023-07-06 | 前端

前言

最初是用wordpress的,很多东西都很方便,尤其是用了docker,非常的爽,不需要我去关心过多的东西。 但是,作为一个开发人员,很多时候,会有一些新奇的想法,想加进去,但是,我是一个java开发,我不可能费劲去改wordpress这的一个成品系统,所以就想到了自己开发。

技术选型

首先就是打包器的选择了,毫无疑问,就在webpack和vite之间。

webpack

优点:非常成熟的方案,从3-5,你想要的,遇到的问题,百度谷歌基本都搜的到。 有非常多的插件,满足你各种需求。

缺点:缺点我觉得和有点一样,东西太多,反而太重了。尤其是运行

vite

优点:非常轻量化,3秒启动,10秒内打包,打出包的大小,也很出色。 使用了很多成熟的技术,稳定性还是有保证的。

缺点:技术很新,很多东西没完善,尤其是ssr。很多东西,百度也找不到方案。

ts和js

ts属于是js的超集,因为他最终还是要编译成js来运行的,他对js进行了功能补全。带来了很多不错的功能

vue版本

一想到ssr,很多人第一反应就是nuxt,但是nuxt只支持vue2。这里再说下,我做东西,是为了学习,不是为了实现公司项目,肯定以新技术为主。

框架搭建

所以我最终选择了,vue3 + ts + vite2这样一个选择

创建项目首先执行如下:

#常见的模板,vue  vue-ts  react react-ts
yarn create @vitejs/app my-vue-app --template vue-ts
 
cd my-vue-app
yarn
yarn dev

打开localhost:3000,发现默认页面,启动成功。

到这里,就完成了第一步。 通俗的讲,vue是先加载ui,后加载数据的纯客户端环境。 我们要做的博客,要达到浏览器能搜索的到的程度,所以我们用到了ssr,通过服务端来加载技术。 如果从我这个后端人员来讲,我个人理解,这就是jsp的模式。 那可能有人问:为什么不用jsp呢?这可能就涉及到前后端分离的必要性了。 后续,我们将完成ssr环境搭建。