首页 > TAG信息列表 > Nuxt

Nuxt.js安装

下载 npx create-nuxt-app <项目名> 选项 Project name: (demo2)//项目名 Programming language: (Use arrow keys)//语言 > JavaScript TypeScript Package manager: (Use arrow keys)//包管理器 > Yarn Npm UI framework: (Use arrow keys)//UI框架 > None Ant Desi

Vue.js最佳静态站点生成器对比

在过去的几年中，Vue.js 已成为 Web 应用程序开发的流行选项。用户变多后，这个框架开始将触角伸向了静态站点生成，一个曾经由 React 统治的领域。 就像 React 这边的 Gatsby 和 NextJS 一样，Vue.js 这边支持静态网站生成的框架也有不少。但考虑到它们提供的众多功能，想要挑一个合适

linux部署vue或nuxt

1、如果是vue  运行npm run build  　　如果是nuxt  运行 npm run  generate 　　打包dist 到根目录   2、在linux安装nginx进行映射   3、nginx.conf配置 server { listen 8099; #listen somename:8080; server_name localhost;

Nuxt中使用自定义环境变量

欢迎关注前端早茶，与广东靓仔携手共同进阶 前端早茶专注前端，一起结伴同行，紧跟业界发展步伐~ 1、安装cross-env npm i cross-env -D 2、根目录下新建env.js文件； 文件内容如下；二选一 一、 module.exports = { // 开发测试环境 dev: { NODE_ENV: 'development', API_URL

利用nuxtJS 制作纯静态页面的开发【SSR】

创建这样的一个纯静态的SSR形式的公共项目，下次只要copy除node_modules文件之外的所有文件  重新npm i 就可以了；   1.创建项目  npx create-nuxt-app <项目名>   2. swiper 轮翻图的插件   【我的这片博客有详细说明 ：https://www.cnblogs.com/tap819/p/16243250.html】   3.

为什么使用Nuxt.js？

Why Nuxt.js？ Nuxt.js利用Vue.js开发SSR应用的一站式解决方案，是一个基于Vue.js的通用应用框架。 服务端渲染 首先我们讲清楚服务端渲染（SSR） 与 静态站点生成（SSG） 的区别。我们可以在浏览器里直接输出Vue的组件，然后利用其js来生成和操作用户端展示的DOM，这就是SPA的传统思路。而SSR中我

Nuxt.js常见问题和优化

Nuxt.js常见问题和优化 1. 常见问题和解决方案1.1 NuxtServerError connect ECONNREFUSED 127.0.0.1:801.2 如何在 head 里面引入js文件?1.3 nuxt使用less,sass等预处理器1.4 如何使用px2rem1.5 如何拓展 webpack 配置1.6 如何添加 vue plugin1.7 如何修改环境变量 NODE_EN

Nuxt.js学习

为什么要学 Nuxt.js ？ 目前我也没有使用 Nuxt.js 技术，公司项目里面没有使用到，自己没去做过这方面的内容，主要原因是目前不需要使用，但是有些公司已经在使用了，并且因为它解决了一些问题，虽然同时也带来了另一些问题，但是各有各的使用场景嘛，还是了解了解吧，待我们需要使用的时候，会更

nuxt生产环境报错:Failed to execute 'appendChild' on 'Node': This node type does not su

初次用nuxt，发现它的坑还真不少，一个坑能坑你很久，这里我给大家做一个汇总 今天在打包测试环境的时候发现启动项目，浏览器里报标题所示的错误，乍一看，不知所措，就开始找原因，你会发现，在本地开发的时候同样也有报错    这里还给你列出了出问题的父级和子级元素，看起来还挺人性化，然后找到

nuxt.js自定义模版

最近做项目需要考虑网站的响应式，组件化以及seo优化，所以最后定型用nuxt.js去搞起～～ 一开始对这个框架不是很熟悉，虽然是基于vue语法，但是我一开始就踩了一个坑，按照官网流程去进行项目的安装之后，npm run dev直接就可以启动项目，由于网站有公共头部，所以我去看怎么能够将公共对部分通过nuxt

Nuxt $router.push 失效原因记录

<a @click="setCCY" class="dropdown-item" href="#">EUR</a> ## href="#"此种写法有毒，相同path在调用<a @click="setCCY" class="dropdown-item" href="javascript:void(0);">EUR</a>

nuxt.js局部引入js获取ip地址

1.使用nuxt.js的head属性，局部引入js export default { head(){ return { script:[{ src:'http://pv.sohu.com/cityjson?ie=utf-8' }], } }, } 2.页面调用 created() { var cip = returnCitySN["cip"]; var cname = returnCitySN["cname&quo

nuxt cookie-universal-nuxt 搭配 vuex-persistedstate 做数据持久化

前言 因为服务端不存在 Local Storage 和 Session Storage 所以 便使用了 cookie-universal-nuxt 这个插件 在做Nuxt项目的时候 发现Vuex 在刷新页面后 储存的数据丢失 用 vuex-persistedstate 来持久化数据 cookie-universal-nuxt 安装 cookie-universal-nuxt 的安装 npm in

【无标题】nuxt 性能优化提升访问速率毫秒级（catch）

此文的目的是解决基于vue服务端渲染SSR之nuxt框架的性能提升，已知的条件服务端渲染必须用到服务器，但是当后端接口不给力的时候，当千万级别的并发的时候，后端带宽自然不够用了，后端不给力，频繁的接口抖动自然而然拖垮了前端服务器，其实我们的nuxt是一个无辜的受害者，我们虽然无辜，但是我

公司官网深度优化之路，半年时间百度收录网页4000+

继vue的seo问题之后，反响很强烈，也得到了大家的认可，但是我对vue的seo也仅仅停留在理论方面，并没有实际进行过优化，也不知道具体效果会是什么样的，恰巧公司官网上线三个月后需求增加不是那么多，所以想停下来先对官网进行优化。 首先是选择哪种方案进行优化，上篇文章提到过，vue的seo解决方案

Nextjs相关概念

一 Nextjs: Nuxt.js是使用 Webpack 和 Node.js 进行封装的基于Vue的SSR框架，不需要自己搭建一套 SSR 程序，而是通过其约定好的文件结构和API就可以实现一个首屏渲染的 Web 应用。 Nuxt.js 是一个 Node 程序，必须使用 Node 环境。我们对 Nuxt.js 应用的访问，实际上是在访问这个 Node.js

使用GitBash创建项目无法选择的问题

1. 解决GitBash在创建项目时无法选择的问题； 2. windows 使用 Git Bash 上下箭头不生效的解决方案； 3. 使用winpty指令创建（以创建nuxt项目为例）： （1）原始指令：npx create-nuxt-app my-app; （2）使用winpty指令后的指令：winpty npx.cmd create-nuxt-app my-app; （3）总结：其他创建项目指令也是同

nuxt 使用图片懒加载 lazy-component 标签报错

在nuxt使用图片懒加载的时遇到的问题，在未使用<lazy-component>标签的时候还是正常的，但是使用了之后，就直接40多个异常提示出来 后面发现，需要在<lazy-component>标签外面加多个<no-ssr>标签就好了 <no-ssr> <lazy-component> ... </lazy-component> </no-ssr> 个人博客地

Nuxt入门之client-only原理

仓库：vue-client-only/index.js at master · egoist/vue-client-only · GitHub 1.简介 client-only用于在ssr中指定组件在客户端渲染 2.原理 export default { name: 'ClientOnly', functional: true, props: { placeholder: String, placeholderTag: {

nuxt中引入公共的scss文件

1.如果要使用 sass 就必须要安装 node-sass和sass-loader 。 npm install --save-dev node-sass sass-loader   2.这是我安装的版本 3.在根目录创建自己的css文件    4.然后在nuxt.config.js中配置      5.f12查看是否引入成功    这里看到是生效了

尚硅谷_在线教育_Nuxt整合错误

直接引用vue-front-1010 模板，执行npm run dev时报错。 ERROR in ./.nuxt/client.js friendly-errors 20:20:03 Module build failed (from ./node_modules/babel-loader/lib/ind

Nuxt

Nuxt的generate和build的分别打包方式 https://blog.csdn.net/qq_33315564/article/details/107523958 PM2 介绍 https://www.douban.com/note/314200231/ 负载均衡，Node进程管理器

webstorm+Chrome配置nuxtjs的debug模式

1、配置nuxt.config.js 2、右上角点击edit Configurations，新增一个JavaScript Debug url地址填写项目启动之后的地址，端口号就是服务的端口号 选择.nuxt，Remote URL填写webpack：///src 点击Apply，完成配置 3、配置完成之后。根据package.json中的启动命令，控制台启动服务。 4、点击

如何使用webify快速构建Nuxt应用

Webify是云开发团队推出的一款一站式托管服务产品，这是一个专为 Web 开发者打造的云上开发、部署平台，帮助开发者快速开发、预览、部署自己的 Web 应用，还支持从Github等第三方代码托管平台导入应用，为前端开发者提供极佳的服务体验。 应用场景 静态网站： Web 应用托管不仅支持托管静态

nuxt.js添加typescript支持

最近在新做一个nuxt.js项目，给它添加了typescript支持，按照 https://typescript.nuxtjs.org/guide/setup/ 文档里的步骤添加， 1、 yarn add --dev @nuxt/typescript-build @nuxt/types 2、修改 nuxt.config.js, 添加tsconfig.json