腾讯云开发者社区-腾讯云

开发者社区

文档建议反馈控制台

文章/答案/技术大牛

发布

综合排序丨最热优先丨最新优先

Nuxt.js：构建现代 Web 应用的强大框架 Nuxt.js 是一个基于 Vue.js 的开源框架，旨在简化开发现代 Web 应用的工作流程。静态站点生成 (SSG) 通过 Nuxt.js 的 nuxt generate 功能，你可以轻松生成静态 HTML 文件，从而创建完全静态化的网站。性能优化：从代码拆分到懒加载，Nuxt.js 提供了许多开箱即用的性能优化功能。强大的社区支持：Nuxt.js 拥有庞大的社区和活跃的贡献者，数百个模块和插件可供选择。多功能性：无论是构建服务端渲染应用、静态站点，还是单页应用，Nuxt.js 都能胜任。如何开始使用 Nuxt.js？以下是快速上手 Nuxt.js 的步骤： 1. 初始化项目通过命令行创建一个新项目： 123 npx nuxi init my-nuxt-appcd my-nuxt-appnpm install 2.

2025-04-16

1.4K0

标签:

服务端渲染

3、对业务开发人员来说，曲线变长 Nuxt.js 是一个基于 Vue.js 的通用应用框架。适用于服务端渲染SSR的场景。二、开始使用使用脚手架直接启动 $ npx create-nuxt-app <项目名> 应用现在运行在 http://localhost:3000 上运行。 static 静态文件目录用于存放应用的静态文件，此类文件不会被 Nuxt.js 调用 Webpack 进行构建编译处理。服务器启动的时候，该目录下的文件会映射至应用的根路径 / 下。 Nuxt.js 框架集成了 Vuex 状态树的相关功能配置，在 store 目录下创建一个 index.js 文件可激活这些配置。 nuxt.config.js 文件个性化配置用于组织 Nuxt.js 应用的个性化配置，以便覆盖默认配置。

2024-03-06

9140

标签:

服务端渲染

Nuxt 3 来了！

Nuxt 3.0 来了，让我们一起来看看它有哪些让人激动的新特性！新特性！ Nuxt 3 的重构精简了内核，并且让速度更快，开发体验更好。流畅的升级到 Nuxt3 我们致力于在让用户更加轻松的从 Nuxt2 升级到 Nuxt3。遗留的插件和模块将保持工作 Nuxt2 配置是兼容的部分 pages options API 可用将 Nuxt 3 的体验带到现有的 Nuxt2 项目中当我们在开发 Nuxt 3 的新特性的同时，在 Nuxt2 中启用 Nitro 在 Nuxt2 中使用 Composition API（和 Nuxt3 一样）在 Nuxt2 中使用新的 CLI 和 Devtools 渐进式升级到 Nuxt3 兼容 Nuxt2 的模块生态系统一片片的升级（Nitro、Composition API、Nuxt Kit）感谢您的耐心，我们已经迫不及待的发布它，并且得到您的反馈 —— Nuxt 团队。

ssh_晨曦时梦见兮

2022-03-10

2.7K0

标签:

nuxt「建议收藏」

Nuxt.js 是一个基于 Vue.js 的通用应用框架。通过对客户端/服务端基础架构的抽象组织，Nuxt.js 主要关注的是应用的 UI渲染。团队创建了脚手架工具 create-nuxt-app。 nuxt.config.js 文件用于组织Nuxt.js 应用的个性化配置，以便覆盖默认配置。路由 Nuxt.js 依据 pages 目录结构自动生成 vue-router 模块的路由配置。要在页面之间使用路由，我们建议使用<nuxt-link> 标签。命名视图要渲染命名视图，您可以在布局(layout) / 页面(page)中使用 <nuxt name="top"/> 或 <nuxt-child name="top"/> 组件。

全栈程序员站长

2022-09-20

5.1K0

标签:

Nuxt 3 来了！

Nuxt 3.0 来了，让我们一起来看看它有哪些让人激动的新特性！新特性！ Nuxt 3 的重构精简了内核，并且让速度更快，开发体验更好。流畅的升级到 Nuxt3 我们致力于在让用户更加轻松的从 Nuxt2 升级到 Nuxt3。遗留的插件和模块将保持工作 Nuxt2 配置是兼容的部分 pages options API 可用将 Nuxt 3 的体验带到现有的 Nuxt2 项目中当我们在开发 Nuxt 3 的新特性的同时，在 Nuxt2 中启用 Nitro 在 Nuxt2 中使用 Composition API（和 Nuxt3 一样）在 Nuxt2 中使用新的 CLI 和 Devtools 渐进式升级到 Nuxt3 兼容 Nuxt2 的模块生态系统一片片的升级（Nitro、Composition API、Nuxt Kit）感谢您的耐心，我们已经迫不及待的发布它，并且得到您的反馈 —— Nuxt 团队。

玖柒的小窝

2021-09-27

2.3K0

标签:

Nuxt引用cookie-universal-nuxt在服务端请求cookie

官方文档 npm install cookie-universal-nuxt -s 在nuxt.config.js添加 modules: [ 'cookie-universal-nuxt', ['cookie-universal-nuxt', { alias: 'cookiz' }], ], 设置cookie this.

2021-04-20

2.6K0

标签:

Nuxt配置错误页面

<h2 v-if="error.statusCode == 404">404 - 页面不存在</h2> <h2 v-else>服务器错误</h2> <button> <nuxt-link to="/">HOME</nuxt-link> </button> </div> </template> <script> export default { props: [

2021-01-20

1.8K0

标签:

Nuxt 踩坑记

最近开始学习 Nuxt 框架，写此博文记录学习中遇到的坑。 Nuxt 默认路由与自定义 API 路由 Nuxt 是一个服务端渲染框架，与普通的前后端分离不同（需要同时开两个端口进行开发），而 Nuxt 只需要开一个服务端的端口。默认是 3000。 /routes/index')(app) 3 4 // Give nuxt middleware to express 5 app.use(nuxt.render) COPY 内置的axios 与 asyncData 使用 axios 获取数据并挂载 Nuxt 中内置了 axios，并挂载在 Vue 实例中的 $axios 上，通过在 nuxt.config.js 添加配置可以增加前缀，代理等。在 Nuxt 中，要实现这样的效果，只需要引入 <nuxt-child />，在 Nuxt 中路由自动生成，文件夹即父路由，文件夹里的即子路由，在外层文件夹中加入一个与路由同名的 Vue 文件即可。

2021-12-28

3K0

标签:

Nuxt 过渡效果配置

如果需要炫酷的页面过渡效果可以进行配置和定制官网提供了transitions进行页面切换过度效果配置页面级过渡（vue3项目页面必须有唯一的根节点才会有过渡效果）nuxt.config.ts 进行配置 opacity: 0; /* filter: blur(1rem); */ transform: translateX(50px);}</style>布局过渡同理如果做布局过渡，切换布局效果配置nuxt.config.ts

2023-10-30

6730

标签:

Nuxt3 实战 (四)：安装 Nuxt UI 和配置 Typescript 类型检查

前言对于 UI 组件库的选择，我考虑过：Ant Design Vue、Element-Plus，但感觉这两款组件库太偏向业务风格了，现在项目的搭建最好能偏年轻化一点，最后还是选择了：Nuxt UI，主要是 Nuxt UI 是 Nuxt 官方推荐的，而且完美兼容 Nuxt，并且是用 TypeScript 编写的，并为所有组件和可组合函数提供类型。安装 Nuxt UI 1、执行安装命令 pnpm add @nuxt/ui 2、添加到 nuxt.config 模块中 export default defineNuxtConfig({ modules : ['@nuxt/ui'] }) 3、需要注意的是，这里 Nuxt UI 会自动安装以下这些模块： @nuxtjs/tailwindcss @nuxtjs/color-mode nuxt-icons 4、现在，我们可以在 Nuxt 应用中使用所有组件和可组合函数✨，我们在 app.vue 中加入代码： <template> <div class="w-screen h-screen flex

白雾茫茫丶

2025-08-13

1.6K0

标签: