首页
最新

用nuxt3官方提供的nuxt-icon插件来引入iconify的海量图标

旧的引用方式 这里我们不用ant蚂蚁框架的图标,我们从iconify从导入图标。 iconify图标是一种矢量图标格式,它可以以小尺寸的形式显示在各种设备上,如移动设备、桌面应用程序和网页。iconify图标可以缩放到任何尺寸而不失真,并且可以通过CSS或JavaScript进行动态更改。Iconify图标还支持多种颜色和主题,使其适合各种不同的设计需
发布于 2024-4-14 下午10:0 阅读数 194

Nuxt3 - 使用 SheetJs 将 JSON 转换并下载为 Excel 文件

安装 npm i --save https://cdn.sheetjs.com/xlsx-0.20.1/xlsx-0.20.1.tgz 参考文档:https://docs.sheetjs.com/docs/ 代码示例: <script setup> import { ref } from 'vue' import { utils, writeFileXLSX } from 'xlsx' const pres = ref([ { name: '小丽', birthday: '1998-02-22' }, { name: '小美', birthday: '1
发布于 2024-3-17 下午8:50 阅读数 317

Nuxt3 – 使用navigateTo更改URL查询并使用watch进行监控

<script lang="ts" setup> const route = useRoute() watch( () => route.query, () => { console.log(route['query']) } ) function move() { navigateTo({ name: 'example', query: { foo: 'bar' }, }) } </script> <template> <button @click="move">move</button> </template&g
发布于 2023-11-7 下午2:13 阅读数 2585

解决antd v4.x版本和Nuxt3样式会闪的问题

antdv从4.0.x开始官方提供了@ant-design-vue/nuxt模块包,但如果你只是使用它,不做任何处理的话,你就会发现你的页面在刷新时会短暂的出现css样式丢失的问题,导致页面闪烁,本文就教大家如何解决该问题。 首先,在新建的nuxt3项目中安装相关依赖 pnpm add -D ant-design-vue@4.x pnpm add -D @ant-design-vue/nuxt 在nuxt.config
发布于 2023-10-22 上午9:33 阅读数 3599

Nuxt3.7.1版本引入@nuxtjs/i18n 实现国际化

首先也是要去安装 # Using npm npm install @nuxtjs/i18n@next --save-dev # Using yarn yarn add --dev @nuxtjs/i18n@next # Using pnpm pnpm install --shamefully-hoist -D @nuxtjs/i18n@next 配置nuxt-config.ts export default defineNuxtConfig({ modules: [ '@nuxtjs/i18n', ], }) 配置i18n export default defineN
发布于 2023-9-7 上午11:56 阅读数 14754

最新版Nuxt3.6.5与Antd4.0版本的安装

Nuxt3 可以说是隔三差五就更新,时不时就加点小功能,如果加了开发者模式devtools,在最新的Nuxt3.6.5中解决了 v3.6.4 中引入的 nuxt/content 的回归问题。 它更新的时候,对我们使用的UI框架也会有一些影响,拿最新版的Antd4.0框架来说,根据Antd官方给的安装方式https://next.antdv.com/docs/vue/introduce-cn 也是可以使用,但是
发布于 2023-8-4 下午6:23 阅读数 9728

Cannot start nuxt: Cannot find module 'typescript'

升级到Nuxt3.6报错 Cannot start nuxt: Cannot find module 'typescript' 解决该报错我们只需要安装下typescript依赖即可 yarn add typescript --dev 参考:https://github.com/nuxt/nuxt/issues/21723
发布于 2023-6-25 上午10:17 阅读数 9616

nuxt3 中的 Websocket / SSE(Server-sent events) 客户端实现

什么是SSE SSE(Server-sent events)是一种用于服务器向客户端推送数据的技术,它基于 HTTP 协议,允许服务器不断地向客户端发送事件流数据。与传统的轮询或长轮询相比,SSE 更加高效、实时,并且可以降低服务器和客户端的负载。 SSE 的工作原理是客户端通过 HTTP 请求与服务器建立连接,然后服务器可以在连接保持打开的情况下,不断
发布于 2023-6-10 下午9:13 阅读数 2778

Nuxt3环境变量配置

本文节选自TeHub小书:https://tehub.com/b/show/9rRbSM55RP/chapter/bMn14mFXKS Nuxt3环境变量配置 通常我们的应用程序会有多个运行环境。比如开发环境、测试环境、预发布环境、生产环境等。而不同环境我们的配置内容可能不一样,这个时候就需要通过环境变量来解决。 Nuxt3 会自动加载 .env 文件中的所有变量,但对于多环境及多个.
发布于 2023-3-16 下午4:29 阅读数 1354

Nuxt3创建WebSocket服务器

虽然官方说目前nuxt3服务端暂不支持创建ws服务器,详见:https://github.com/unjs/nitro/issues/467 https://github.com/nuxt/nuxt/discussions/16663 但是我们还是可以通过以下两种方案启动一个ws服务器 方案一:开发模式hook启动Ws服务器 但是我们开发模式下(yarn dev)还是可以创建一个ws服务器的 安装ws包 yarn add ws 创建
发布于 2023-3-1 下午6:5 阅读数 1808

Nuxt3 报错Hydration node mismatch

本文内容节选自tehub小书 https://tehub.com/b/show/9rRbSM55RP/chapter/bw7Ta7r6Jx 这个报错目前暂不清楚是Nuxt3还是Antdv或是Vue3导致的。 报错示例 创建一个nuxt3页面pages/test.vue,内容如下: <template> <a-dropdown> <a class="ant-dropdown-link" @click.prevent> Hover me <DownOutlined /&gt
发布于 2023-2-20 下午1:41 阅读数 1308

Nuxt3

文章: 11关注: 4点击: 0
推荐作者
欢迎关注微信公众号:Golang社区
兴趣使然的学习者
所谓成长,就是在听到波涛汹涌四个字,再也联想不到大海了。
无喜无悲
暂无描述