Nuxt3如何新建项目

news2024/9/22 7:22:13

第一步 创建项目

1.新建一个文件目录 nuxt-app
2.命令行cd到目录下运行 npx nuxi init nuxt-test 回车运行下
nuxt-test是文件名自己随意
3.再cd nuxt-test到目录下 运行npm install
4.运行完成后 npm run dev 启动项目 显示以下页面
在这里插入图片描述

第二步 修改入口代码,编写自己的代码

在这里插入图片描述
1.在app.vue根目录同级新建pages文件夹 再新建一个index页面(新建文件目录参考官方文档视图)
2.app.vue代码里面修改为

<template>
  <div>
    <NuxtPage></NuxtPage>
  </div>
</template>

index.vue 里面写点代码保存后 链接刷新
在这里插入图片描述
如果显示空白没有出现自己写的内容,重新运行一下项目即可
本人修改代码后刷新是显示空白页面 重新运行后才看到自己写的内容

nuxt3官方文档地址:https://nuxt.com.cn/docs/getting-started/introduction

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/733022.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

从零开始的PICO教程(2)--实时预览应用场景

从零开始的PICO教程&#xff08;2&#xff09;–实时预览应用场景 基于串流能力&#xff0c;你可以通过 PDC 工具在头戴上实时预览应用内场景。​ 文章目录 从零开始的PICO教程&#xff08;2&#xff09;--实时预览应用场景一、提示信息​二、准备工作​三、操作步骤​四、故…

SpringBoot3【④ 基础特性(外部和内部化配置,整合Junit)】

1. SpringApplication 1.1. 自定义 banner 类路径添加banner.txt或设置spring.banner.location就可以定制 banner推荐网站&#xff1a;Spring Boot banner 在线生成工具&#xff0c;制作下载英文 banner.txt&#xff0c;修改替换 banner.txt 文字实现自定义&#xff0c;个性化…

笔记本没有WIFI列表解决方案

是否有网络图标类似于地球的图案 打开个性化 点击打开或关闭系统图标 查看网络那一项是否是打开 如果没有打开就打开注册表 如果不是上图中的数据&#xff0c;就右键新建输入以上的数据。如果还是不能解决就进行如下操作 打开控制面板&#xff0c;打开网络与Internet,再打…

初出茅庐的小李博客之机智云获取网络实时时间(NTP)

机智云获取网络实时时间 机智云代码中其实这么一个函数gizwitsGetNTP( )可以获取网络时间&#xff0c;今天就在STM32F407上教大家如何通过机智云获取NTP网络时间。 简单介绍一下NTP: 网络时间同步现在有2种同步协议NTP和PTP&#xff0c;NTP与PTP不同在于时间戳的产生位置。N…

Kubernetes对象深入学习之二:细说schema.ObjectKind

欢迎访问我的GitHub 这里分类和汇总了欣宸的全部原创(含配套源码)&#xff1a;https://github.com/zq2599/blog_demos 在前文咱们对对象体系有了大概了解&#xff0c;接下来就要按照前面换分的三个知识区域逐个深入学习&#xff0c;今天从最简单的对象类型开始 runtime.Object…

PWM 输出实验(stm32)

目录 PWM的代码pwm.cpwm.h main.c 说明&#xff1a;以下内容参考正点原子的资料 PWM的代码 pwm.c //TIM3 PWM部分初始化 //PWM输出初始化 //arr&#xff1a;自动重装值 //psc&#xff1a;时钟预分频数 void TIM3_PWM_Init(u16 arr,u16 psc) { GPIO_InitTypeDef GPIO_InitSt…

华为云CodeArts Build-云端化的编译构建平台

随着互联网企业业务种类增多&#xff0c;业务跨平台&#xff0c;多语言编程成为常态。 传统应用软件为本地应用&#xff0c;业务复杂&#xff0c;软件规模大&#xff0c;编译构建耗时长&#xff0c;而且移动终端APP业务变化快&#xff0c;交付要求短平快。 因此一个支持多语言…

环型链表oj

文章目录 题目描述解决方法 题目描述 给定一个链表的头节点 head &#xff0c;返回链表开始入环的第一个节点。 如果链表无环&#xff0c;则返回 null。 如果链表中有某个节点&#xff0c;可以通过连续跟踪 next 指针再次到达&#xff0c;则链表中存在环。 为了表示给定链表中…

java 阿里云直播配置及推拉流地址获取

一、开通阿里云直播 首先进入阿里云直播产品主页&#xff1a;https://www.aliyun.com/product/live 。 点击下方的“立即开通”。 如果是还未注册的用户请按照页面提示进行完成注册并实名认证。 2、首次进入会提示开通服务&#xff0c;点击“开通服务”&#xff0c;然后选择计…

[C++] 万字 - C++异常处理分析介绍: 异常概念、异常抛出与捕获匹配原则、重新抛出、异常安全、异常体系...

C语言 错误处理方式 在C语言中, 代码发生错误一般会有两种处理方式: 终止程序. 比如 直接使用assert()断言. 或者直接崩溃 返回、设置错误码 C语言某些函数执行失败, 但是结果不足以导致致命问题时, 就会将错误码设置在errno中. 用户可以通过strerr(errno)来获取错误信息. …

Linux的管道符详解

&#xff08;该图由AI绘制 关注我 学习AI画图&#xff09; 目录 管道&#xff08;重点&#xff09; 1、管道符 2、过滤&#xff08;筛选&#xff09;功能 3、特殊功能&#xff08;了解&#xff09; 4、统计功能&#xff08;重点&#xff09; 5、xargs命令扩展 管道&…

多元分类预测 | Matlab全连接神经网络(DNN)分类预测,多特征输入模型

文章目录 效果一览文章概述部分源码参考资料效果一览 文章概述 全连接神经网络(DNN)分类预测,多特征输入模型 多特征输入单输出的二分类及多分类模型。程序内注释详细,直接替换数据就可以用。程序语言为matlab,程序可出分类效果图,迭代优化图,混淆矩阵图。 部分源码

设计数据库时,字段“是否可用”该取什么英文名?研究active/enable/state/progress的区别

一条记录发布后&#xff0c;除了删除状态&#xff0c;还存在可用、不可用状态&#xff08;并非审核状态&#xff09;&#xff0c;那么这个字段在数据库中该取什么名字呢&#xff1f;先告诉结果&#xff1a;使用active英文单词衍生出的is_active。 表可用 active - 意为活跃或生…

Java经典面试题下包含答案

21.String、StringBuffer和StringBuilder的区别是什么&#xff1f; 线程安全&#xff1a; String中的对象是不可变的&#xff0c;线程安全StringBuffer对方法加了同步锁&#xff0c;所以是线程安全的StringBuilder没有对方法加同步锁&#xff0c;所以是非线程安全的 使用效率…

【STM32单片机】STM32控制SG90舵机的PWM部分参数的设置解答

STM32控制SG90舵机的PWM部分参数的设置解答 一、舵机控制要知道的知识二、PWM的参数要怎么计算1、为什么要分频呢&#xff1f;2、为什么选择TIM_OCMode_PWM1呢&#xff1f; 每天进步一点点 笔记仅供自学&#xff0c;用来回看复习&#xff0c;不一定适合你&#xff0c;如有错误请…

论青春线上书屋的设计与实现(论文+源码)_kaic

目 录 摘 要 III 第一章 绪论 1 1.1本课题研究背景与意义 1 1.2本课题国内外研究现状 1 第二章 开发技术介绍 3 2.1JDK的安装与配置 3 2.2HTML技术 3 2.3MySQL数据库管理系统 4 2.4JDBC的使用 4 第三章 系统分析 5 3.1系统的设计要求 5 3.2系…

交通 | 动态设施选址问题

论文解读 陈迎新&#xff0c;柯斯琪&#xff0c;曲晨辉&#xff0c;张景琪 编者按 本次解读的文章是Transportation Science 2017年的 《在日益增长的市场中&#xff0c;动态设施选址问题的连续逼近方法》&#xff08;Wang, X., Lim, M. K., & Ouyang, Y. (2017). A conti…

空元素不占用位置处理

一. 问题场景&#xff1a; 如果将一个元素的CSS设置为margin-right: 10px&#xff0c;即使这个元素为空&#xff0c;那么这10px依然存在&#xff0c;效果如下&#xff1a; <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8&q…

【编译原理】词法分析程序设计(C语言)

目录 一、实验内容二、实验原理三、结果分析四、源代码一、实验内容 给定下表所示的一个简单语言的词法规则描述完成以下任务: (1)画出识别该语言词法规则的状态转换图; (2)依据状态转换图,设计并编制词法分析程序,实现从输入源程序中,识别出各类单词,即关键字、标识…

打工人如何利用自动化实现职场突围

作为优秀的打工人&#xff0c;如果可以将办公中的重复性、繁琐性、低效性工作自动化&#xff0c;那么将省去许多日常工作。许亚宁就是这样一个优秀的打工人&#xff0c;善于使用各类自动化工具来提升工作效率&#xff0c;上周的直播他分享了如何利用自动化工具&#xff0c;实现…