nuxt项目搭建

1.先下载nuxt脚手架

yarn create nuxt-app <项目名>,记得安装完项目,npm i,下载node包

目录介绍

components

存放组件分别是头部(包含导航)和底部

layouts 

页面布局,实现一个页面整体架构规则,头部,主体,底部组件放在layouts 中实现页面的整体布局

pages

存放主体的内容文件

2.在根目录创建layouts文件夹,调用头部,主体,底部

3.在pages文件下的index.vue中加入 layout: 'BaseLayout',才会展示头部和尾部内容,注意,主体内容文件,都需要加layout: 'BaseLayout',不加会导致页面展示不完整

4.样式用 less页面报错

在package.json中加入这两行代码,删除node包,重新npm i 下载node包

头部文件中写入,语言切换,不同语言展示,不同的语言导航

主体,引入不用语言的组件,展示不同的语言内容

另一个地址文章写的特别清晰,可以浏览

Nuxt 学习笔记_nuxt笔记-CSDN博客

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

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

相关文章

XTuner InternLM-Chat 个人小助手认知微调实践

要解决的问题&#xff1a; 如何让模型知道自己做什么&#xff0c;是什么样身份。是谁创建了他&#xff01;&#xff01;&#xff01; 概述 目标&#xff1a;通过微调&#xff0c;帮助模型认清了解对自己身份弟位 方式&#xff1a;使用XTuner进行微调 微调前&#xff08;回答…

精致女童时尚穿搭~你想要的我都有哦

不论是版型还是颜色 都绝绝子的一件轻薄外套 整件看着干净利落有设计感 两侧按扣式口袋超级实用的 穿着透气不闷热 搭配各种风格的裤子都一绝

【安卓基础5】中级控件

&#x1f3c6;作者简介&#xff1a;|康有为| &#xff0c;大四在读&#xff0c;目前在小米安卓实习&#xff0c;毕业入职 &#x1f3c6;本文收录于 安卓学习大全持续更新中&#xff0c;欢迎关注 &#x1f3c6;安卓学习资料推荐&#xff1a; 视频&#xff1a;b站搜动脑学院 视频…

无线听觉新体验:南卡、韶音、墨觉骨传导耳机综合评测

作为一个资深的跑步爱好者&#xff0c;我几乎离不开音乐的陪伴。不知道大家有没有同感&#xff0c;有时候一首歌曲就是我坚持下去的动力&#xff0c;尤其是在那段艰难的跑步时刻。但是找到一款既能让我在运动中自由呼吸、又能提供优质音乐体验的耳机&#xff0c;并不是一件容易…

C#,动态规划(DP)丢鸡蛋问题(Egg Dropping Puzzle)的三种算法与源代码

1 扔鸡蛋问题 动态规划&#xff08;Dynamic Programming&#xff0c;DP&#xff09;是运筹学的一个分支&#xff0c;是求解决策过程最优化的过程。20世纪50年代初&#xff0c;美国数学家贝尔曼&#xff08;R.Bellman&#xff09;等人在研究多阶段决策过程的优化问题时&#xf…

船舶制造5G智能工厂数字孪生可视化平台,推进船舶行业数字化转型

船舶制造5G智能工厂数字孪生可视化平台&#xff0c;推进船舶行业数字化转型。随着数字化时代的到来&#xff0c;船舶行业正面临着前所未有的机遇与挑战。为了适应这一变革&#xff0c;船舶制造企业需要加快数字化转型的步伐&#xff0c;提高生产效率、降低成本并增强市场竞争力…

电气机械5G智能工厂数字孪生可视化平台,推进电气机械行业数字化转型

电气机械5G智能工厂数字孪生可视化平台&#xff0c;推进电气机械行业数字化转型。随着科技的不断发展&#xff0c;数字化转型已经成为各行各业发展的重要趋势。电气机械行业作为传统制造业的重要组成部分&#xff0c;也面临着数字化转型的挑战和机遇。为了更好地推进电气机械行…

就业月薪14K!两年后涨到25K! 考研失败后,这个95年小哥哥成功转行软件测试,人生开挂了!

01 考研连续失败 因为没有特别明确的职业规划&#xff0c;加上内心的学历崇拜情节。大学毕业后&#xff0c;我没有选择参加工作&#xff0c;而是毅然选择了加入考研大军。 备考的日子紧张有序&#xff0c;我也一直在题海里废寝忘食的遨游&#xff0c;本以为能顺顺当当地考上自…

Windows环境下查看磁盘层级占用空间的解决方案

大家好,我是爱编程的喵喵。双985硕士毕业,现担任全栈工程师一职,热衷于将数据思维应用到工作与生活中。从事机器学习以及相关的前后端开发工作。曾在阿里云、科大讯飞、CCF等比赛获得多次Top名次。现为CSDN博客专家、人工智能领域优质创作者。喜欢通过博客创作的方式对所学的…

生产环境下,应用模式部署flink任务,通过hdfs提交

前言 通过通过yarn.provided.lib.dirs配置选项指定位置&#xff0c;将flink的依赖上传到hdfs文件管理系统 1. 实践 &#xff08;1&#xff09;生产集群为cdh集群&#xff0c;从cm上下载配置文件&#xff0c;设置环境 export HADOOP_CONF_DIR/home/conf/auth export HADOOP_CL…

vue2和vue3 setup beforecreate create生命周期时间比较

创建一个vue程序&#xff0c;vue3可以兼容Vue2的写法&#xff0c;很流畅完全没问题 写了一个vue3组件 <template><div></div> </template><script lang"ts"> import {onMounted} from vue export default{data(){return {}},beforeCr…

解决SpringAMQP工作队列模型程序报错:WARN 48068:Failed to declare queue: simple.queue

这里写目录标题 1.运行环境2.报错信息3.解决方案4.查看解决之后的效果 1.运行环境 使用docker运行了RabbitMQ的服务器&#xff1a; 在idea中导入springAMQP的jar包&#xff0c;分别编写了子模块生产者publisher&#xff0c;消费者consumer&#xff1a; 1.在publisher中运行测试…

【机器学习的主要任务和应用领域】

曾梦想执剑走天涯&#xff0c;我是程序猿【AK】 目录 简述概要知识图谱 简述概要 了解机器学习的主要任务和应用领域 知识图谱 机器学习的主要任务可以分为监督学习、无监督学习和半监督学习。 监督学习&#xff1a;这是机器学习中最为常见的一类任务&#xff0c;基于已知类…

R语言数据分析(五)

R语言数据分析&#xff08;五&#xff09; 文章目录 R语言数据分析&#xff08;五&#xff09;前言一、什么是整洁的数据二、延长数据2.1 列名中的数据值2.2 pivot_longer()的处理原理2.3 列名中包含许多变量的情况2.4 列名同时包含数据和变量 三、扩宽数据3.1 pivot_wider的处…

力扣226 翻转二叉树 Java版本

文章目录 题目描述解题思路代码 题目描述 给你一棵二叉树的根节点 root &#xff0c;翻转这棵二叉树&#xff0c;并返回其根节点。 示例 1&#xff1a; 输入&#xff1a;root [4,2,7,1,3,6,9] 输出&#xff1a;[4,7,2,9,6,3,1] 示例 2&#xff1a; 输入&#xff1a;root…

[云原生] 二进制k8s集群(下)部署高可用master节点

在上一篇文章中&#xff0c;就已经完成了二进制k8s集群部署的搭建&#xff0c;但是单机master并不适用于企业的实际运用&#xff08;因为单机master中&#xff0c;仅仅只有一台master作为节点服务器的调度指挥&#xff0c;一旦宕机。就意味着整个集群的瘫痪&#xff0c;所以成熟…

这才开工没几天收到Offer了,简历改的好,找工作没烦恼。

喜报喜报 这才开工没几天&#xff0c;就收到了喜报&#xff01; 就像上面截图中所说的一样&#xff1a;简历改了真的有用。 我也和大家分享一下优化简历的技巧&#xff0c;希望对大家有帮助&#xff0c;把握住金三银四的机会&#xff0c;都能顺利上岸&#xff0c;升职加薪&am…

Leetcode日记 2583. 二叉树中的第 K 大层和

Leetcode日记 2583. 二叉树中的第 K 大层和 题目&#xff1a;解题思路&#xff1a;代码实现制作不易&#xff0c;感谢三连&#xff0c;谢谢啦 题目&#xff1a; 给你一棵二叉树的根节点 root 和一个正整数 k 。 树中的 层和 是指 同一层 上节点值的总和。 返回树中第 k 大的层和…

Vue2 基础面试题

v-show 和 v-if 区别 v-show 通过 CSS display 控制显示和隐藏v-if 通过判断组件真实渲染和销毁&#xff0c;而不是显示和隐藏频繁切换显示状态用 v-show&#xff0c;否则用 v-if v-if 当 v-if 与 v-for 一起使用时&#xff0c;v-for 具有比 v-if 更高的优先级&#xff0c;意…

PolarDN MISC做题笔记

cat flag 使用01打开flag.png,发现图片尾部有padding的数据。D0 CF 11 E0 A1 B1 1A E1为office2007以前版本的文件头。将其另存为flag.doc,打开发现提示需要密码。&#xff08;可以注意到&#xff1a;D0CF11E0非常类似DOCFILE&#xff09; 使用john的office2john.py 提取hash …