1.接下来新建/component/maincontent.vue

把这些html代码copy到maincontent.vue

发现格式比较难看，就格式化一下

2.插件安装 beautify,安装后重启vs，按F1 搜beaut,格式化html

把css copy过来 刷新

样式有点问题。原来少了bootstrap.css,修改nuxt.confg.js增加bts

Npm run dev 发现报错，原来bootstrap加载了字体 但项目里没有包含，

把字体copy过来放到目录 重新npm run dev

正常了

接下来按照上面的方式，把剩下 的maincontent都完善起来。

这样就把maincontent完成了，接下来把footer.vue也实现

这样一个纯静态的nuxt+vue 就完成了，查看源代码

就会发现和纯vue的区别，纯vue是没有文本的，所以对seo不利

6.【nuxt起步】-完成一个静态的页面的更多相关文章

  1. 使用 Eclipse 创建一个静态的登录页面

    要求: 使用 Eclipse 创建一个静态的登录页面 实现步骤: 在 Eclipse 中,点击"File",显示菜单,选择"New" "Other&q ...

  2. 利用PHP的ob函数实现生成静态化页面

    之前用过一些开源的CMS管理系统,当时就很好奇后台中的生成HTML静态文件是怎么实现的.今天和同事讨论了下,没想到同事之前做过这类的生成静态页面的功能,果断向他请教了下. 经他讲解后,才知道其实生成静 ...

  3. 利用git+hugo+markdown 搭建一个静态网站

    利用git+hugo+markdown 搭建一个静态网站 一直想要有一个自己的文档管理系统: 可以很方便书写,而且相应的文档很容易被分享 很方便的存储.管理.历史记录 比较方面的浏览和查询 第一点用M ...

  4. 用php生成静态html页面(通用2种方法)

    因为每次用户点击动态链接的时候都会对服务器发送数据查询的要求 对于一个访问量可能达百万千万级别的网站来说 这无疑是服务器一个大大的负担 所以把动态数据转换成静态html页面就成了节省人力物力的首选 因 ...

  5. 领导让我重新做一个微信H5页面！

    leader:我们需要做一个微信H5页面,效果如图,功能如描述,时间越快越好. 需求是不是很简单呢?2015-11-24 12:44:00文末有最新更新 背景描述 前几天微信转发相关项目开发后,这是第 ...

  6. 开发日志系列：一个表单页面的呈现与提交（一）——JSON的操作

    JSON操作 引子 最近在做一个表单页面,大概是这个样子的 这里打算用一个JSON存储所有的信息,我们可以理解为,所有东西都存在一个字符串里面.方便,快捷,易读,数据库操作也方便了.甚至,可以将很多不 ...

  7. [转] 两个静态html页面传值方法的总结

    版权声明:本文为博主原创文章,未经博主允许不得转载. https://blog.csdn.net/csdn_ds/article/details/78393564 问题 因最近尝试实现客户端与服务端分 ...

  8. 谈谈iOS开发如何写个人中心这类页面--静态tableView页面的编写

    本文来自 网易云社区 . 一.本文讲的是什么问题? 在开发 iOS 应用时,基本都会遇到个人中心.设置.详情信息等页面,这里截取了某应用的详情编辑页面和个人中心页面,如下: 我们以页面结构的角度考虑这 ...

  9. 静态web页面与动态web页面的区别

    一.静态web页面 在静态web程序中,客户端使用web浏览器经过网络连接到服务器上,使用HTTP协议发起一个请求(Request),告诉服务区我现在需要得到哪个页面,所有的请求交给web服务器,之后 ...

随机推荐

  1. python socket相关

    套接字的工作流程(基于TCP和 UDP两个协议) TCP和UDP对比 TCP(Transmission Control Protocol)可靠的.面向连接的协议(eg:打电话).传输效率低全双工通信( ...

  2. day01 项目

    项目名称: 编写登陆接口 项目需求:     1 输入用户名密码     2 认证成功后显示欢迎信息     3 输错3次之后锁定,包括下次运行此程序也要锁定,涉及到持久化的问题只能用python 自 ...

  3. windows系统使用的误区

    1.软件不要装在c盘,影响系统运行速度. 软件c盘不会影响系统运行,会提高软件运行速度 PS:前提条件:C盘有足够的空余空间(50G以上). 大多数软件安装默认路径在C盘的原因是不知道电脑分区的情况, ...

  4. 01 Java 代码是怎么运行的

    Java代码运行的方式 1:在开发工具中运行 2:双击 jar 文件运行 3:在命令行中运行 4:在网页中运行 上述运行方式都离不开 JRE,也就是 Java 运行时环境.实际上 JRE 仅包含运行 ...

  5. [译]如何在迭代字典的过程中删除其中的某些item(Python)

    最好不要在迭代的过程中删除.你可以使用解析式和filter过滤. 比方说: {key:my_dict[key] for key in my_dict if key !="deleted&qu ...

  6. 【转】Unicode utf8等编码类型的原理

    原文地址http://www.cnblogs.com/daxiong2014/p/4768681.html Unicode utf8等编码类型的原理 1.ASCII码  我们知道,在计算机内部,所有的 ...

  7. HDU——2087剪花布条

    剪花布条 Time Limit: 1000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others) Total Submi ...

  8. mybatis学习（五）——增删改查及自增主键的获取

    一.mybatis的增删改查 1.修改hotelMapper接口 package com.pjf.mybatis.dao; import com.pjf.mybatis.po.Hotel; publi ...

  9. Eclipse + Jersey 发布RESTful WebService（一）了解Maven和Jersey，创建一个WS项目（成功！）

    一.下文中需要的资源地址汇总 Maven Apache Maven网站 http://maven.apache.org/ Maven下载地址: http://maven.apache.org/down ...

  10. Keepalived+NFS+SHELL脚本实现NFS-HA高可用

    本来想做DRBD+HEARTBEAT,但是领导说再加硬盘浪费资源,没有必要,而且在已有硬盘上做风险较大,所以就只能用rsync来实现数据同步了,实验中发现很多的坑,都用脚本和计划任务给填上了,打算把这 ...