一、前言
如今最火、最流行的前端框架是vue,但vue只能用于开发前端,这意味着前后端必须得分开开发。
对于稍大点的公司来说,这样做问题并不大,毕竟人手充足,但对于小公司、乃至个人开发者来说,前后端分离开发实际上就是一件吃力不讨好的事情,很浪费人力、精力。
而nuxt这个框架就能很好的解决这个问题,该框架直接集成了前后端,其前端依旧是使用vue框架,后端则使用nodejs生成web服务器。
这样做其性能可能比不上go、rust,但其带来的时间成本缩减效益却是绝对的显而易见,因为这意味着我们可以用同一套代码完成前后端开发、同一套环境进行测试以及发布上线,这是一个非常好的体验。
而且根据我的经验来看,对于小公司、个人开发者来说,千万不要过于看重性能,因为你前期很长一段时间内可能都不会有什么流量,这时候你去耗费时间研究搞所谓的高并发、追求极致的性能,绝对是一件吃力不讨好的事情!
二、nuxt框架搭建
目前网上我并没有找到一套足以带领新手从零入门nuxt框架的教程,尤其是最新版本nuxt3,因此大多数时候,我们最好的参考教程其实就是其官网:Nuxt: The Intuitive Vue Framework · Nuxt
但对于新手来说,直接看其官网入门还是有点难度的,所以本文将结合其官网的教程,带领大家过一遍nuxt框架的运行逻辑、以及如何使用它进行前后端网站开发。
首先我们需要初始化nuxt开发框架,运行下面这条命令:
npx nuxi@latest init <project-name>
注意后面的<project-name>
需要替换为我们的项目名。
至于这里的npx,是需要你提前安装好nodejs环境的,它是npm包管理工具的一个命令执行工具,可以直接用。
但你直接用大概率会出现下面这个报错:
这是因为它需要去外网下载一些数据,解决这个问题的最好方式就是翻墙,如果不会可以微信联系我。
但仅仅是翻墙依旧不够,它这个文件存放的位置使用默认DNS很多时候都解析不到,所以还需要修改一下电脑的DNS解析:
上图是Win11设置界面中修改Ipv4的DNS解析位置,可以自行将其修改为:114.114.114.144
然后我们再执行命令,就可以执行了:
注意它第一步会让你选择包管理器,这里默认用npm即可,如果你想用其它包管理器也可自行选择使用。
至于后面两个选项,第一个是想让你参与数据收集,我选择了no,第二个是初始化git仓库,我选择了yes。