Mark一下: 在 Nuxt.js应用中使用Google统计分析服务,或者百度统计分析服务,推荐在 plugins 目录下创建 plugins/ga.js 文件.统计统计分析我们可以获取网站pv,uv数据,来判断网站的页面那些更受用户欢迎,有利于网站后期的发展,这里主要讲解nuxt.js应用中的添加方式 添加百度统计 ga.js页面内容如下: export default ({ app: { router }, store }) => { /* 每次路由变更时进行pv统计 */ router.a

起源 最主要的原因时使用vue-cli搭建的SPA(单页应用)不利于搜索引擎的SEO操作.搜索引擎对SPA的抓取并不好,特别是百度根本没法抓取到SPA的内容页面,所以我们必须把我们的应用在服务端渲染成适合搜索引擎抓取的页面,再下载到客户端. Nuxt.js是Vue.js的通用框架,最常用的就是用来作SSR(服务器端渲染).再直白点说,就是Vue.js原来是开发SPA(单页应用)的,但是随着技术的普及,很多人想用Vue开发多页应用,并在服务端完成渲染.这时候就出现了Nuxt.js这个框架,她简化了

Nuxt.js 是一个通过 Vue 用于服务端渲染的简单框架,灵感来自 Next.js. 目前尚处于开发阶段,1.0 版本即将发布 1 分钟视频演示 Nuxt 基于 ES2015,这使得代码有着更愉快,更整洁的阅读体验.它不使用任何转换器,并取决于 Core V8 实现的功能.由于这些原因,nuxt.js 目标为 Node.js 4.0 或更高版本(如果运行节点 <= 6.5.0,则可能需要使用--1128.www.qixoo.qixoo.com/harmony-proxies 标志启动节点)

作为互联网门外汉,同时作为不专业的站长,我总是有很多问题想知道,比如百度统计和CNZZ在数据统计上总是有差异,就好像王婆卖瓜,自卖自夸,又好像公说公有理,婆说婆有理. 作为专业的不专业的市场人员,好奇心使得我不得不刨根问底(其实也没有不得不),咳~ 1.不看广告,看疗效 为了体现此篇文章的公平公正性(作为CNZZ粉丝狗,我是摸着良心说的),首先展示的患者们的反馈情况,这些患者都有一个共同特点就是既服用了“百度统计”胶囊也服用了“CZNN”大力丸.患者反馈如图: 这位患者看来是12年使用了两款不同

背景 近期在做内部系统的重构,从一线业务彻底的重构,经过充分的考虑我们准备把这个项目打造成前台业务的试验站,比如ssr和一些其他的前沿技术的探索,积累充分的经验后待合适的契机应用到C端的项目中. 既然涉及到重构,避免不了老生常谈的话题技术选型.当然开始还是走了一些弯路,因为是后台项目,最重要的当然是快速迭代,基于此在UI层我们准备使用开源的方案,目前社区比较成熟的两种UI库(antdesign.elementUI)我们拿给UI同学对比,UI同学还是比较倾向于antdesign的,所以我们开始尝试

直接使用 Vue 构建前端单页面应用,页面源码时只有简单的几行 html,这并不利于网站的 SEO,这时候就需要服务端渲染 2016 年 10 月 25 日,zeit.co 背后的团队对外发布了一个 React 的服务端渲染应用框架 Next.js 几小时后,一个基于 Vue.js 的服务端渲染应用框架应运而生,与 Next.js 异曲同工,这就是 Nuxt.js 一.快速模板 在已经安装了 vue-cli 的前提下,可以快速创建一个 nuxt 的项目模板 vue init nuxt-commu

前言 哈喽大家周一好,今天的内容比较多,主要就是包括:把前端页面的展示页给搭出来,然后调通接口API,可以添加数据,这两天我也一直在开发,本来想一篇一篇的写,发现可能会比较简单,就索性把项目搭建的过程简化,一次写好了,在开发 Nuxt.js 框架的过程中,我发现相比之前还是有些变化的,如果你是读过我第一个前后端分离系列的小伙伴,可能看过我简单说过Nuxt框架的一些知识<Nuxt.js 是什么?>,我发现现在在项目搭建的过程中,已经优化了一些功能,今天就重头搭建一下. 如果你没有看过之前的文章,

缘起 哈喽大家周二好呀,刚刚经历过了几天火车抢票,整个人都不好了,不知道小伙伴对今年的春节是否还一如既往的期待呢,眼看都要春节了,本来也想写篇2018总结篇,但是怕不免会出现鸡汤文的窠臼嫌疑,想想还是算了,这几天和老李聊起来关于写博客文章,总感觉这一系列还没有写完,或者说还有一些没有收尾好,眼看就要春节了,周末我也好好的整理整理思路,决定临时开一个4-6篇的小系列文章 —— 基于Nuxt.js框架的提Bug小项目(命名为 tBug),当然以后会增加更多的功能,这个只是1.0版本,你一定好奇为啥要

前言 哈喽大家周五好,又是一个开开心心的周五了,接下来就是三天小团圆啦,这里先祝大家节日快乐咯,希望都没有加班哈哈,今天公司发了月饼,嗯~时间来不及了,上周应该搞个活动抽中几个粉丝发月饼的,下次吧,这里先预告一下,圣诞节活动,给粉丝送苹果吧哈哈,不过听起来好 low 呀,大家有好的想法可以下边评论或者来群里一起交流哟~ 说接上文,昨天咱们第一次的接触到了一个新的框架 Nuxt<二七║ Nuxt 基础:框架初探>,从概念上,给大家简单说了下这个框架的产生和应用场景,大家学习这一块一定要有一定的

前置知识 SSR服务器渲染 Vue SSR(server side rendering)服务端渲染 和 Vue SPA(single page application)单页应用 Vue SSR->将本来要放在浏览器执行创建的组件,放到服务端先创建好,然后生成对应的html 将他们直接发送到浏览器,最后将这些静态标记激活为客户端完全可交互的应用程序 SSR针对SPA的好处: 1)更好的SEO,由于搜索引擎抓取工具可以直接查看完全渲染后的页面 2)更快的到达时间(time-to-content),特

Nuxt.js国际化的前提是,已经使用脚手架工具搭建好了Nuxt.js的开发环境. 我使用的环境是nuxt@2.3 + vuetify@1.4 + vue-i18n@7.3 1. 先安装vue-i18n npm install --save vue-i18n 2. 更新store文件 在@/store/index.js文件中,修改添加如下代码: export const state = () => ({ locales: ['en-US', 'zh-CN'], locale: 'en-US' }

初始化Nuxt.js项目步骤 1.使用脚手架工具 create-nuxt-app 创建Nuxt项目 使用yarn或者npm $ yarn create nuxt-app <项目名> 注:根据自己的实际情况初始化项目 2.添加公共的css样式文件 如果要使用 sass 就必须要安装 node-sass和sass-loader $ yarn add node-sass sass-loader -D 在assets文件夹下创建公共的scss样式文件: /assets/styles/common.sc

head: { title: 'nuxt', meta: [ { charset: 'utf-8' }, { name: 'viewport', content: 'width=device-width, initial-scale=1, maximum-scale=1.0, user-scalable=0' }, { hid: 'description', name: 'description', content: 'Nuxt.js project' } ], link: [ { rel: '

nuxt.js的项目由于是服务端渲染,通过js动态调整不同尺寸设备的根字体这种rem方案存在一种缺陷.由于设置字体的代码不能做服务端渲染,导致服务端返回的代码一开始没有相应的跟字体,直到与前端代码进行合并根字体改变,这就造成我们的应用初始状态会根据两种根字体改变尺寸,体验很不好. 于是采用服务端可以渲染的css解决方案. vw + postcss-pxtorem    或者    vw + sass(自己实现px2rem),这里如果是nuxt项目推荐使用第一种方式. nuxt.config.js

SSR服务端渲染 之前用vue做项目时,在浏览器中查看网页源码,是没有具体内容的,只有一个标签,用服务端渲染的话,查看网页源码数据都会显示出来,所以有利于SEO,能够被搜索到. Nuxt.js是做Vue SSR的框架,基于vue 2, 包含了vue-router,(vue本身不带路由,是通过插件的方式做路由,把vue-router的配置变得非常简单,甚至不用配就能用) 支持vuex,(跨组件的状态管理工具) 支持vue-server-render, 支持vue-meta. 安装 官网安装方式:n

vee-validate 是为 Vue.js 量身打造的表单校验框架,允许您校验输入的内容并显示对应的错误提示信息.它内置了很多常见的校验规则,可以组合使用多种校验规则,大部分场景只需要配置就能实现开箱即用,还支持自定义正则表达式.而且支持 40 多种语言,对本地化.多语言支持非常友好. 国内饿了么团队开源项目 Element UI 就用到了 vee-validate. vee-validate官网:https://baianat.github.io/vee-validate/ 1. 安装 安装

一.实现步骤 1.安装vue-i18n并且创建store.js(vuex状态管理)文件 2.创建一个(middleware)中间件,用来管理不同的语言 3.创建不同语言的json文件作为语言包(例如: ~locales/en.json) 4.在pages文件夹下创建文件,并进行翻译 二.详细步骤 1.安装vue-i18n npm install vue-i18n --save 2.在nuxt应用程序中引入vue-i18n 新建文件  ~plugins/i18n.js,内容如下: import V

查了一下nuxt的github才知道是node.js版本太低造成的,据说升级到8.6以上就可以了(本人直接升了9.9) node_modules\nuxt\lib\core\middleware\nuxt.js:72 const policies = this.options.render.csp.policies ? {...this.options.render.csp.policies} : null ^^^ SyntaxError: Unexpected token ... at cre

Nuxt.js 提供了两种发布部署应用的方式:服务端渲染应用部署 和 静态应用部署. 静态应用部署就不说了,主要说说服务端渲染应用部署. 官方部署方式 关于服务端渲染应用部署,官方文档是这么写的: 部署 Nuxt.js 服务端渲染的应用不能直接使用 nuxt 命令,而应该先进行编译构建,然后再启动 Nuxt 服务,可通过以下两个命令来完成: nuxt build nuxt start 推荐的 package.json配置如下: { "name": "my-app",

vuejs服务端渲染更好的SEO,SSR完全指南Nuxt.js静态站生成器SSR 完全指南https://cn.vuejs.org/v2/guide/ssr.html在 2.3 发布后我们发布了一份完整的构建 Vue 服务端渲染应用的指南.这份指南非常深入,适合已经熟悉 Vue, webpack 和 Node.js 开发的开发者阅读.请移步 ssr.vuejs.org.Vue SSR 指南 | Vue.js 服务器端渲染指南https://ssr.vuejs.org/zh/ Nuxt.js(ht