从零开始Grunt】的更多相关文章

[20141025]从0开始Grunt *:first-child { margin-top: 0 !important; } body>*:last-child { margin-bottom: 0 !important; } /* BLOCKS =============================================================================*/ p, blockquote, ul, ol, dl, table, pre { margi…
Aug 17, 2013 Tags: gruntJavascriptnodejs Comments: 9 Comments grunt让Nodejs规范起来 从零开始nodejs系列文章,将介绍如何利Javascript做为服务端脚本,通过Nodejs框架web开发.Nodejs框架是基于V8的引擎,是目前速度最快的Javascript引擎.chrome浏览器就基于V8,同时打开20-30个网页都很流畅.Nodejs标准的web开发框架Express,可以帮助我们迅速建立web站点,比起PHP的…
现在web开发的趋势是前后端分离.前端采用某些js框架,后端采用某些语言提供restful API,两者以json格式进行数据交互. 如果后端采用node.js,则前后端可以使用同一种语言,共享某些可重用的Js代码,并共享构建工具.但很多时候我们可能采用别的语言,如ruby/java/scala等,此时前后端代码基本上是完全独立的.虽然大家都在同一个项目中,但可以分成互相独立的两块,并且前后端通常使用不同的构建工具. 比如当后端使用Scala时,我们会使用sbt进行项目构建,对scala代码进行…
本人的博客写了grunt的小教程,从零开始,一步一步的通过例子讲解,希望喜欢的同学给我的github上加颗星,谢谢! github地址: https://github.com/manlili/grunt_learn grunt入门:点击我学习 grunt配置:点击我学习 grunt创建任务:点击我学习 grunt实例:点击我学习 grunt创建插件:点击我学习…
"手动是不可能手动的了,这辈子都不可能手动的了." 一.目标 上一章我们借助ngRoute,完成了口袋妖怪SPA系统的多模块导航开发,但是现在引用的东西越来越多,项目文件目录开始变得混乱不堪: 现在先对当前项目文件列表进行整理,将五大模块移入src文件夹中: 然后修改index.html中的js引用路径: <script src="src/pokemon/pokemon.js"></script> <script src="s…
一直想写个总结,不过实在太忙了,所以一直拖啊拖啊,拖到现在,不过也好,有了这段时间的沉淀,发现自己又有了小小的进步.哈哈...... 原想框架开发的相关开发步骤.文档.代码.功能.部署等都简单的讲过了,就此了结本系列文章,经过这段日子的深入学习,发现本系列文章讲的还是太肤浅了,很多东西都没有讲到,也没有说明白.所以过段时间空闲些了,会继续从理论上来讲解怎么去设计一个框架(也算是给自己定个目标,加加压力),有了前面的代码了解,再学习理论相信大家也更容易接受了. 小结 学习如逆水行舟,不进则退,当能…
导航 1.关掉访问保护 2.发布网站 3.复制网站到服务器 4.添加新网站 5.设置网站访问权限 6.设置文件夹访问权限 7.控制可更新文件夹执行权限 8.设置“应用程序池”.net版本与模式 9.附加数据库 10.添加数据库访问用户 11.设置数据库链接 12.部署注意事项 对于网站的安全部署方面,大家请看我以前写的<服务器安全部署文档>里面已基本上将服务器相关的安全设置都讲到了,照着里面的操作一般的黑客是比较难攻击进来的(代码漏洞除外),而本章的部署则是是该篇设置好的基础上来创建站点的.…
       ASP.NET从零开始学习EF的增删改查           最近辞职了,但是离真正的离职还有一段时间,趁着这段空档期,总想着写些东西,想来想去,也不是很明确到底想写个啥,但是闲着也是够无聊的.思前想后,今天决定写一个简单的EF的增删改查给大家吧.本次教程,尽量少用控件,尽量做到,纯HTML+JS+后台代码.           好了,废话不说了,能看到这篇文章的,应该都是想知道EF的一些增删改查的操作,所以,应该也是知道EF的一些优点.鉴于也有可能有新手可能第一次使用,我就简略讲…
原文地址:初学seaJs模块化开发,利用grunt打包,减少http请求 未压缩合并的演示地址:demo2 学习seaJs的模块化开发,适合对seajs基础有所了解的同学看,目录结构 js — —dist   //压缩后的目标文件夹 —lib   //各个模块 —drag    //拖拽模块 —scale   //缩放模块 —seajs    //seajs库 —seajs_drag    //入口的主文件main.js —main.js /*——————————————————————————…
[课程主题] 主题:5天,一起从零开始学习BPM [课程形式] 1.为期5天的短任务学习 2.每天观看一个视频,视频学习时间自由安排. [第五天课程] 1.课程概要 Step 1 软件下载:H3 BPM10.0全开放免费下载:http://bbs.h3bpm.com/read.php?tid=861&fid=11 Step 2 安装资料:参考本博的"安装资料"分类 Step 3 产品在线帮助浏览:http://bbs.h3bpm.com/read.php?tid=286&…
[课程主题] 主题:5天,一起从零开始学习BPM [课程形式] 1.为期5天的短任务学习 2.每天观看一个视频,视频学习时间自由安排. [第四天课程] 1.课程概要 Step 1 软件下载:H3 BPM10.0全开放免费下载:http://bbs.h3bpm.com/read.php?tid=861&fid=11 Step 2 安装资料:参考本博的"安装资料"分类 Step 3 产品在线帮助浏览:http://bbs.h3bpm.com/read.php?tid=286&…
[课程主题] 主题:5天,一起从零开始学习BPM [课程形式] 1.为期5天的短任务学习 2.每天观看一个视频,视频学习时间自由安排. [第三天课程] 1.课程概要 Step 1 软件下载:H3 BPM10.0全开放免费下载:http://bbs.h3bpm.com/read.php?tid=861&fid=11 Step 2 安装资料:参考本博的“安装资料”分类 Step 3 产品在线帮助浏览:http://bbs.h3bpm.com/read.php?tid=286&fid=11 St…
[课程主题]主题:5天,一起从零开始学习BPM[课程形式]1.为期5天的短任务学习2.每天观看一个视频,视频学习时间自由安排. [第二天课程] Step 1 软件下载:H3 BPM10.0全开放免费下载:http://bbs.h3bpm.com/read.php?tid=861&fid=11 Step 2 安装资料:参考本博的"安装资料"分类 Step 3 产品在线帮助浏览:http://bbs.h3bpm.com/read.php?tid=286&fid=11 Ste…
[课程主题] 主题:5天,一起从零开始学习BPM [课程形式] 1.为期5天的短任务学习 2.每天观看一个视频,视频学习时间自由安排. [第一天课程] Step 1 软件下载:H3 BPM10.0全开放免费下载:http://bbs.h3bpm.com/read.php?tid=861&fid=11 Step 2 安装资料:参考本博的"安装资料"分类 Step 3 产品在线帮助浏览:http://bbs.h3bpm.com/read.php?tid=286&fid=11…
这个指南解释了如何使用 Gruntfile 来为你的项目配置task.如果你还不知道 Gruntfile 是什么,请先阅读 快速入门 指南并看看这个Gruntfile 实例. Grunt配置 Grunt的task配置都是在 Gruntfile 中的grunt.initConfig方法中指定的.此配置主要是以任务名称命名的属性,也可以包含其他任意数据.一旦这些代表任意数据的属性与任务所需要的属性相冲突,就将被忽略. 此外,由于这本身就是JavaScript,因此你不仅限于使用JSON:你可以在这里…
从本篇开始会陪大家一起从零开始走一遍 jQuery 的奇妙旅途,在整个系列的实践中,我们会把 jQuery 的主要功能模块都了解和实现一遍. 这会是一段很长的历程,但也会很有意思 —— 作为前端领域的经典之作,jQuery 里有着太多奇思妙想,如果能够深入理解它,对于我们稳固js基础.提升前端大法技能来说大有裨益. 另外,本系列的相关代码均可以从 我的github 上获取到. 1. 免 new 实现 我们在使用很多插件的时候,都需要使用 new XXX() 的写法来实例化一个引用: var li…
前言 Grunt是一款前端构建工具,帮助我们自动化搭建前端工程.它可以实现自动对js.css.html文件的合并.压缩等一些列操作.Grunt有很多插件,每一款插件实现某个功能,你可以通过npm命名去下载插件,然后使用它们.关于grunt的使用以及配置,卤煮不打算在此介绍.本篇博文重点要讲的是如何快速开发一款自定义的grunt插件.因为卤煮在打包合并代码的时候发现了无法将html和js混合的文件进行压缩处理,为此卤煮也翻了很多资料,没查找到理想的解决方案.在山穷水复之时,硬着头皮自己开发了一个简…
也算是用了半年Grunt,几个月前也写过一篇它的入门文章(点此查看),不得不说它是前端项目的一个得力助手.不过技术工具跟语言一样日新月异,总会有更好用的新的东西把旧的拍死在沙滩上(当然Grunt肯定没死,gulp也不是多新颖的东西). 看标题很明显知道相比Grunt,我会更为推崇gulp,不是说Grunt不好,而是gulp效率更高.健壮性更好,配置也更为简单,自然也值得我们为它任性一回. 先谈谈上述提到的gulp的优越性: 一. 性能更高 相对Grunt频繁的IO操作读写,gulp是将项目任务流…
在不久前我曾写了一篇 应用r.js来优化你的前端 的文章,为大家介绍了r.js这个实用工具,它可以很好地压缩.合并前端文件并打包整个项目.但是如果将r.js放到项目中,我们不得不顾及到一个问题——项目每维护一次,就需要维护的人员输入一次rjs运行口令重新打包项目,自然是非常繁琐的事情.另外如果我们的项目用sass来写样式,可能还得外开一个koala.如果我们能让项目自己处理自己的所有事宜,那一切就美好多了. 针对上述问题,今天我们就利用更为大众的工具——Grunt,来自动化地处理前端事务(其实r…
相关插件的引用: grunt-usemin  对页面的操作 grunt-contrib-cssmin  压缩css load-grunt-tasks 瘦身gruntfile grunt-rev给md5加密 实际的使用场景:压缩css文件到指定目录,并且更改页面引用的外链(这里以css为例). 情景一:html页面与要操作的css在同一目录下,且也与操作后的css在同一目录下. **这里使用npm中的注释方式来操作外链的,扩展性很不好. Gruntfile.js内容如下: module.expor…
浅语:grunt中文网:http://www.gruntjs.net/ 第一步:Grunt 依赖 Node.js 所以在安装之前确保你安装了 Node.js.然后开始安装 Grunt. 实际上,安装的并不是 Grunt,而是 Grunt-cli,也就是命令行的 Grunt,这样你就可以使用 grunt 命令来执行某个项目中的 Gruntfile.js 中定义的 task .但是要注意,Grunt-cli 只是一个命令行工具,用来执行,而不是 Grunt 这个工具本身. 安装 Grunt-cli…
记得十五年前自学编程时,拿着C语言厚厚的书,想要上机都不知道要用什么编译器来执行书中的例子.十二年前在大学自学ASP时,由于身边没有一位同学和朋友学习这种语言,也只能整天混在图收馆里拼命的啃书.而再后来也差不多,自学了很多不同的知识,都一直只能自己默默的克服一个又一个困难.所以这几年带一些应届生或只有一两年经验的新人时,都会同他们讲:你们现在太幸福了,有问题可以找度娘,还可以找我来解决.做为过来人,能深深的体会到刚入门的时候,没有系统的介绍和老师指导,会多走很多很多弯路和经历过不知多少不眠之夜,…
最近很忙,杂事也多,所以开发本框架也是断断续续的,终于在前两天将前面设定的功能都基本完成了,剩下一些小功能遗漏的以后发现再补上.接下来的章节主要都是讲解在本框架的基础上进行开发的小巧. 本框架主要有四种日志记录,分别是登陆日志.操作日志.手动收集异常日志和自动收集异常日志四种,大部分日志采集都不用开发者动手实现,在模板与相关的功能类中已自动帮我们将所需要的日志记录下来了. 登陆日志,记录的当然是用户登陆.退出.在线时长的日志,主要是在登陆(Login.aspx).后端首页(Main.aspx,有…
后端首页是管理员登陆后进入的第一个页面,主要是显示当前登陆用户信息.在线人数.菜单树列表.相关功能按键和系统介绍.让管理员能更方便的找到息想要的内容. 根据不同系统的需要,首页会显示不同的内容,比如显示公司公告.公司新闻.内部短消息.个人事务.各种业务提醒......等各种内容,这些大家可以需要去进行呈现. 先上代码 Main.aspx <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="…
对于一个后端管理系统,最重要内容之一的就是登陆页了,无论是安全验证.用户在线记录.相关日志记录.单用户或多用户使用帐号控制等,都是在这个页面进行处理的. 1.在解决方案中创建一个Web项目,并将它设置为启动项 2.添加引用 3.添加WebManage文件夹与Login.aspx文件 4.添加登陆页面HTML代码 <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Login.aspx.c…
这段时间一直在充电,拜读了园子中大神们的博文(wayfarer的<设计之道>.TerryLee的<.NET设计模式系列文章>.卡奴达摩的<设计模式>还有其他一些零散的文章),获益良多,虽然对大部分设计模式还是有点蒙,不过还是大长见识了.另外还购买了园子里范钢大神的大作<大话重构>和其他大神推荐的<重构:改善既有代码的设计>,每天早上早起一小时看书,感觉这个时间头脑清晰,看书的效率特别高,向大家推荐一下,这些书籍都属于需要精读的书籍,有时间的话要反…
最近着手开发一个新项目,打算从工程化的角度整理一套自己的前端开发.发布体系. grunt这些工具,之前别人用我也用,并没有认真想过它们的前世今生,正好趁着这个机会,我来理一理目前业界比较流行这些工具的用处和相互关系. 一.名词解释 nodejs——可以在本地执行js代码的环境(类似java的jdk)npm——nodejs程序包的管理和分发工具grunt——运行在nodejs上的,基于任务的,项目构建工具 (npm+grunt≍java里的maven) 我的理解是,以web前端项目构建为例:   …
npm文档:www.npmjs.com grunt基础教程:http://www.gruntjs.net/docs/getting-started/ http://www.w3cplus.com/tools/grunt-tutorial-start-grunt.html http://www.w3cplus.com/tools/grunt-tutorial-installing-grunt.htmlpackage配置文件 http://blog.csdn.net/woxueliuyun/arti…
原文地址:Grunt学习使用必看 grunt简介神马的不多说,到处一大堆. 我只说说我已经实现了的代码. 按照官方的教程 相信已经配置好了,接下来说 package.json 和 Gruntfile.js这2个文件,package.json是为了告诉grunt我们用哪些插件,这些插件的版本是多少,以及我这个项目的一些信息. 那有人说我怎么知道我需要什么插件,我怎么写这个文件?请看官方的例子: { "name": "my-project-name", "ve…
打包的目的和意义就不用叙述了直接上干货 http://www.gruntjs.net/getting-started里面的教程也太简单了,需要下一番功夫去研究才行.本文将grunt打包的常用方法都用实例描述,更加清晰易懂. 1.    第一个简单的grunt打包 1)需要安装nodejs:http://www.cnblogs.com/chuaWeb/p/nodejs-npm.html 本人的nodejs工程目录为F:\chuaNodejs(后续所有相对路径都是相对于这个目录) 2)命令行到nod…