很久之前就想自己搭一个博客了,最开始用hexo+github,但是换电脑后总是有些麻烦.后来使用WordPress,但是用WordPress总觉得没什么技术含量,前后端都是人家写好的,而且买的垃圾虚拟机老是出问题,动不动就要提交工单解决,所以最后干脆就直接在博客园上写了. 最近比较闲,所以正好抽时间简单看了下node.js,然后看了看express,顺便搭了个博客出来练手.当然也不仅是单纯的练手,更多的算是一种探路或者摸索吧,因为公司虽然有大牛,但更多的是忙于应付业务,基本上是没时间去学学新的东…

前面的话 为什么要引入pug,pug有什么特别之处呢?有一些嵌套层次较深的页面,可能会出现巢状嵌套,如下图所示 在后期维护和修改时,一不小心少了一个尖括号,或者某个标签的开始和闭合没有对应上,就会导致DOM结构的混乱甚至是错误.所以,有人发明了HAML,它最大的特色就是使用缩进排列来代替成对标签.受HAML的启发,pug进行了javascript的实现. Pug原名不叫Pug,是大名鼎鼎的jade,后来由于商标的原因,改为Pug,哈巴狗.其实只是换个名字,语法都与jade一样.丑话说在前面,Pu…

感觉自己有段时间没有跟新了,唉,只是一直找不到可以写的必要 其实我一直对pug特别感兴趣的,安装点我 记得全局安装pug和pug-cli就行了 在webstorm配环境记得在前面加-P a: img 内联式语法 input/自闭合 button.btn.btn-tt.btn-aaa(type="button") #[div 123] ='\n' div#foo(data-bar='foo' checked) 这里面也可以写文字 #[div] ul         each val in…

突然发现在我博客文章中,缺少这一块的记录,那我就补一篇吧. gulp的环境配置和安装:http://www.cnblogs.com/padding1015/p/7162024.html 这里就补充一篇gulpfile.js的配置,用于自动化编译sass和pug文件用: var gulp = require('gulp'); var pug = require('gulp-pug'); var sass = require('gulp-sass'); var rename = require('g…

第一部分:pug(jade)模板引擎 pug,原名jade,是流行的HTML模板引擎,它是HAML在JavaScript上的实现,最大的特色是使用缩进排列替代成对标签. 它简化了HTML的成对标签的写法,使代码更加简洁.开发效率更高,但是同时它也带来了一些副作用:可移植性差.调试困难.性能并不出色. 第二部分:vue2.0中使用pug(jade)       Step1:安装pug和jade依赖 #安装支持pug依赖 npm install pug pug-loader pug-filters…

由于版权问题,现已改名pug.但无须担心,几乎没什么区别.就算依然使用jade也不会有太大影响. 慢慢迁移过渡即可   # 官网 https://pugjs.org # github https://github.com/pugjs/pug # 文档地址https://pugjs.org/language/inheritance.html # 入门指南https://pugjs.org/api/getting-started.html   安装pug   # 全局安装cli npm instal…

 一.开发环境配置 开始之前,假设你已经安装了最新版本的 node 和 npm. 全局安装 vue-cli 和 webpack : npm install vue-cli webpack -g 创建工程:工程名字不能用中文,英文也建议小写. vue init webpack 项目名 按照步骤一步一步执行,需要你添加 Project name,Project description,Author. 然后使用 npm install 安装官方库. 然后使用npm run dev运行我们的项目后浏览器…

深刻认识到总结知识点的重要性,不然遇到似曾相识的问题,要翻老半天的百度才能解决.20171018 pug——文字内部嵌入结构 比如: <a class = "href"> 里边有一段<strong>内部文字</strong>的实例! </a> 要是用pug得这么写: a.href | 里边有一段 strong 内部文字 | 的实例! 是不是很恶心,这么写还老容易出错!但是还有一个简便 的写法: a.href 里边有一段#[strong 内…

上一篇介绍了模板引擎pug.js的用法,这一篇就主要写后台逻辑了. 后台的大部分的功能都有了,只是在已经登录的状态下,前台和后台的逻辑处理还不是很完善. 先上几张图吧,仿旧版的简书,改了下UI,因为没有简书那么多内容,所以没必要完全做成一样的. 1.项目结构 app.js 是整个工程的入口 model 文件夹放连接数据库的逻辑 public 文件夹里全是静态资源 router 文件夹是各个模块的路由文件,route.js是总入口 upload 里是上传的图像文件 views 里全是模板,layo…

一:在HTML中使用pug 在css中有预处理器less和scss来使我们的样式表更加的简介,那么在HTML中有没有这样的格式呢,答案是有的,那就是pug(前身是jade),效果如下: 转译以后 好,看步骤: 第一步:安装pug: #安装支持pug依赖 npm install -g pug pug-loader pug-filters pug-cli 这个地方务必使用全局安装,否则会出现“'pug' 不是内部或外部命令,也不是可运行的程序“ 第二步:了解pug的语法: 具体大家可以去看一下这个官…