公司最近在做的一个项目,依然是采用熟悉的vue开发,数据平台因为其数据量大的特点,采用传统的spa模式,首页加载时间很长,而SSR这种方式对于首屏的加载时间优化显而易见,同时还可以方便的进行SEO。因此借机学习Nuxt.js框架(文档详细,更新快,issue反馈及时)及iview(比较优秀的一款UI,基本满足项目需求)。

项目部分截图

截图一: 账号和密码随意填写

截图二:

截图三:

刷新浏览器,重新从服务器端获取页面,看到是已经渲染过的html

项目地址

git clone https://github.com/moedong/nuxt-iview.git

安装

npm install

开发

npm run dev

// GO to http://127.0.0.1:3000

测试环境

// 需要pm2,如果没有安装的先安装  npm install -g pm2
npm run publish:test

生产环境

// 需要pm2,如果没有安装的先安装  npm install -g pm2
npm run publish:prod

参考资料

nuxt.js
iview
iview-admin
koa-template

使用 nuxt+iview-admin+koa2 开发项目的更多相关文章

  1. iview-cli 项目、iView admin 代理与跨域问题解决方案

    iview-cli 项目.iView admin 跨域.代理问题解决方案 在webpack.dev.config.js文件中: 添加: devServer: { historyApiFallback: ...

  2. Eclipse/Myeclipse 开发项目技巧

    Eclipse/Myeclipse 开发项目 编程的本质: 把现实生活中的业务逻辑用代码实现. eclipse 是一个开放源代码.基于Java的可扩展开发平台. (最初主要用来Java语言开发,但目前 ...

  3. Vue+koa2开发一款全栈小程序(1.课程介绍+2.ES6入门)

    1.课程介绍 1.课程概述 1.做什么? Vue+koa2开发一款全栈小程序 2.哪些功能? 个人中心.图书列表.图书详情.图书评论.个人评论列表 3.技术栈 小程序.Vue.js.koa2.koa- ...

  4. web前端学习路线(含20个真实web开发项目集合)

    目前web前端工程师日均岗位缺口已经超过50000,随着互联网+的深入发展,html5作为前端展示技术,市场人才需求量将呈直线上涨. Web前端工程师的岗位职责是利用HTML.CSS.Java.DOM ...

  5. vue全家桶+Koa2开发笔记(6)--app开发

    1.环境配置 详见文章<Nuxt 开发 - 项目初始化> 1.1  使用nuxt脚手架  https://zh.nuxtjs.org/guide/installation 1.2 在nod ...

  6. iview admin 发布到IIS

    公司项目打算做前后端分离,选型最后选了vue+webapi的模式.于是在网上找到了iview及iview admin 这个后台管理模板,里面东西很完善.有这么好的东西,而且MIT协议,项目本身也比较简 ...

  7. 承接 AutoCAD 二次开发 项目

    本人有多年的CAD开发经验,独立完成多个CAD二次开发项目.熟悉.net及Asp.net开发技术,和Lisp开发技术. 现在成立了工作室,独立承接CAD二次开发项目.结项后提供源码及开发文档,有需要的 ...

  8. 《IT蓝豹》挑战独立开发项目能力

    做了5年的android开发,今天没事写写刚入行不久的时候第一次独立开发项目的心得体会,    当时我刚工作8个月,由于公司运营不善倒闭了,在2011年3月份我开始准备跳槽,    看了一周andro ...

  9. tornado web高级开发项目之抽屉官网的页面登陆验证、form验证、点赞、评论、文章分页处理、发送邮箱验证码、登陆验证码、注册、发布文章、上传图片

    本博文将一步步带领你实现抽屉官网的各种功能:包括登陆.注册.发送邮箱验证码.登陆验证码.页面登陆验证.发布文章.上传图片.form验证.点赞.评论.文章分页处理以及基于tornado的后端和ajax的 ...

随机推荐

  1. BZOJ 2806: [Ctsc2012]Cheat(单调队列优化dp+后缀自动机)

    传送门 解题思路 肯定先要建出来广义后缀自动机.刚开始以为是个二分+贪心,写了一下结果\(20\)分.说一下正解,首先显然\(L_0\)具有单调性,是可以二分的.考虑二分后怎样判合法,对于分割序列很容 ...

  2. LOJ 2541 「PKUWC2018」猎人杀——思路+概率+容斥+分治

    题目:https://loj.ac/problem/2541 看了题解才会……有三点很巧妙. 1.分母如果变动,就很不好.所以考虑把操作改成 “已经选过的人仍然按 \( w_i \) 的概率被选,但是 ...

  3. BUUCTF | [HCTF 2018]admin

    首先爬一遍整个网站,发现有没注册的时候有“login”,"register",这两个页面,注册一个123用户登录后发现有 "index“,”post“,”logout“, ...

  4. Hbuild X 打包 混合式app

    1.调用原生方法的接口文档:http://ask.dcloud.net.cn/docs/ (亲测有效,使用js 调用原生的设备方法是可以的) 2.HbuildX 可以直接真机调试的.(亲测有效,安装好 ...

  5. Luogu P1478 陶陶摘苹果

    Luogu P1478 陶陶摘苹果(升级版) 题目描述 又是一年秋季时,陶陶家的苹果树结了n个果子.陶陶又跑去摘苹果,这次她有一个a公分的椅子.当他手够不着时,他会站到椅子上再试试. 这次与NOIp2 ...

  6. CentOS 如何将.deb 文件 转换.rpm, centos安装deb包

    CentOS 如何将.deb 文件 转换.rpm [root@localhost tmp]#tar zxvf alien_8.88.tar.gz yum install alien [root@loc ...

  7. appium desktop 定位弹出框时报错

    今天在定位真机APP的时候,弹出框的内容死活定位不到,只能定位到背景的内容. 问题:appium desktop 定位弹出框时报错,定位不到,只能定位到背景的内容. 分析: 定位工具找不到弹出框的元素 ...

  8. JS中基本数据类型和引用类型最根本的区别

    栈内存和堆内存:https://segmentfault.com/a/1190000015118062 https://segmentfault.com/a/1190000016389376 变量:内 ...

  9. 2.Jmeter 如何在jsr223 脚本中停止测试任务

    Jmeter 如何在jsr223 脚本中停止测试任务 在可以直接引用ctx的变量的processor中可以执行如下脚本即可. (例如jsr223 postprocessor中) ctx.getEngi ...

  10. spring注解开发:Configuration&Bean

    1.使用xml创建bean的方式 1.首先新建一个maven工程,添加如下依赖 <dependency> <groupId>org.springframework</gr ...