Nuxt3项目搭建详细步骤

Nuxt3项目搭建详细步骤

Nuxt3是基于vue3的服务端渲染的网络框架,官网网址

一、安装环境

1.Nodejs 版本要在14.xx以上,最好为16.9。 按官网上的下载最新的18.xx时会出现问题。

2.VSCode下载最新的.

3.安装vscode 插件volar 对vue3和ts的支持比较好。

4.安装yarn 安装好nodejs后,再执行 npm install -g yarn

二、项目创建。

命令行窗口执行
npx nuxi init <project-name>

如果以上命令执行成功,请忽略此块内容
由于国内众所周知的网络原因,这一步会执行失败:

 ERROR  Failed to download template from registry: request to https://raw.githubusercontent.com/nuxt/starter/templates/templates/v3.json failed, reason: getaddrinfo ENOENT raw.githubusercontent.com

本以为开了科学上网就会没问题的。但还是什么出现这个问题。
这时候就要在打开上面错误中的网址https://raw.githubusercontent.com/nuxt/starter/templates/templates/v3.json
浏览器中返回会数据:

{
  "name": "v3",
  "defaultDir": "nuxt-app",
  "url": "https://nuxt.com",
  "tar": "https://codeload.github.com/nuxt/starter/tar.gz/refs/heads/v3"
}

然后下载https://codeload.github.com/nuxt/starter/tar.gz/refs/heads/v3并且解压,并将解压后文件夹中的starter-3目录中的文件拷贝到你自己的项目目录。

上面的手动操作步骤就是模拟npx nuxi init 的操作。
然后这项目的nuxx3工程的初始化就算完成了。

然后用vscode打开项目目录,在终端执行下载依赖包。

yarn install

三、项目启动

在根目录下执行
yarn dev -o 

这样项目就搭建完成了。步骤很简单,但坑有点多,花了不少时间。




版权声明:本文为凸然网站的原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接及本声明。
原文链接:Nuxt3项目搭建详细步骤

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值