前端速学成财
SxinBoss
这个作者很懒,什么都没留下…
展开
-
前端速学成财:第七课-前端"清洁大妈"的产生
本节知识点: 1.模拟一个需求 2.了解什么是管道 3.测试src.pipe.dest函数1.需求: 项目坐到后面,文件存放”越来越乱”,这也是在项目初期很正常的,尤其是参差不齐的队友参与后. 譬如 我们经常会碰到队友在项目目录下随便编写JS 那么,作为项目组长往往我们要”归类”. 然而,手工拷贝?当然不可能了.2.管道: Linux: cat 1 | grep 123 Wind原创 2016-08-18 20:59:43 · 508 阅读 · 0 评论 -
前端速学成财:第十三课-实战演练:用gulp+EJS像CMS那样生成完整新闻内容面
EJS `npm install ejs --save-dev`这是一个功能很经典而且使用非常简单的JS模板引擎.gulp-ejs插件`npm install gulp-ejs --save-dev`原创 2016-08-19 17:15:02 · 849 阅读 · 0 评论 -
前端速学成财:第八课-速玩JS文件合并和压缩
本节知识点: 1、设置淘宝镜像源 2、合并插件 3、压缩插件1:设置镜像源 来到nodejs安装目录->node_modules->npm->npmrc(Linux:.npmrc) 加上 registry=https://registry.npm.taobao.org2.合并插件 npm install gulp-concat –save-devvar gp=require("gulp"原创 2016-08-18 21:15:26 · 665 阅读 · 0 评论 -
前端速学成财:第九课-webpack篇:编译JS的正确姿势
本节知识点: 1.速度了解CommonJS 2.安装webpack 3.编译我们的JS1.CommonJS是一个规范(http://commonjs.org) 譬如:一个单独的文件就是一个模块.使用require来加载模块,返回文件内部的exports对象 大家看是否和NodeJS的写法很像?确实,NodeJS实现并推动了这个规范(一大部分) 有了这个规范JS可以在任何地方运行,不只是浏原创 2016-08-18 21:38:19 · 427 阅读 · 0 评论 -
前端速学成财:第十课-混合篇:webpack和gulp"勾结"初步
1.gulp插件(这是一个可以无比方便的关联gulp和webpack的插件) npm install gulp-webpack –save-dev2.我们设定一个需求 1、首先使用CommonJS规范编写代码 2、利用webpack编译JS文件 3、编译好后用gulp压缩 注意:需要一次性完成,而不是敲两次命令原创 2016-08-18 22:00:18 · 885 阅读 · 0 评论 -
前端速学成财:第十一课-实战演练:用gulp 构建前端页面(1)---静态构建
上节课 我们利用gulp-webpack插件,把我们安装的gulp和webpack结合并实现了js的编译到压缩一步搞定。 但是问题来了,前端开发总不能只写JS吧,如果我把开发html页面啥的咋整?gulp模板插件: npm install gulp-template –save-dev 通过这个插件,我们可以像写后台模板一样写前端页面.首先我们来学习下写法index.html 模板<!DOCT原创 2016-08-18 22:14:14 · 569 阅读 · 0 评论 -
前端速学成财:第十二课-实战演练:用gulp像CMS那样生成新闻页面
上节课 我们通过gulp-template 写入静态数据生成了一个HTML文件; 那么这节课 我们继续实战提高一下。NodeJS Request模块 npm instal request –save-dev 有了这个库,我们可以在NodeJS里面方便的实现类似curl功能. npm install gulp-rename –save-devnews.php<?php $news=ne原创 2016-08-18 22:44:46 · 674 阅读 · 0 评论 -
前端速学成财:第一课-JavaScript历史
前端开发速学成财(nodejs+gulp+webpack基础实战篇)第一课-JavaScript历史:JavaScript是 Netscape (网景)联合Sun在1995年发布的JavaScript 1.0 随后微软克隆(chao xi)并命名为jscript. 那么问题来了。 如果有各种各样的版本,那就乱套了。 于是,Netscape等公司向ECMP欧洲计算机制造商协会提交草案,正式形成了原创 2016-07-30 11:28:31 · 353 阅读 · 0 评论 -
前端速学成财:第二课-知识点速学
1、学会外部文件引用 2、NPM的初步使用 3、自己创建一个模块1.基本语法(不用理解,死记硬背即可):外部引用时 建议写法:exports.函数名 = function(){ /oo}或module.exports.函数名新建文件 aa.js(后缀随意,通常用js) var getlib=require('./slib'); getlib.showName();原创 2016-07-30 14:41:25 · 390 阅读 · 0 评论 -
前端速学成财:第三课-粗糙的玩一玩javascript的"编译"
1、学会对象属性获取 2、NodeJSP的FS模块使用 3、发明个”编译”JS的过程根据前两节课我们发现 js文件需要考node来解析才能运行,那这个和我们发开前端有什么关系呢? 比如:我们新建一个HTML ,然后在代码里 引用我们上节课的aa.js 然后我们发现并不能运行。原创 2016-07-31 10:28:33 · 390 阅读 · 0 评论 -
前端速学成财:第四课-粗糙的玩一玩css的"编译"
上节课我们模拟了一个所以的"JS编译",今天的问题是:如果是CSS文件咋办?我们先新建个test.css```*{color:red}```如果正常引用 那么网页文字全部变成红色.如果我们按照上节课的思路.require css文件进来 发现会报错的.它会把require进来的文件当前脚本来解析。原创 2016-08-03 11:09:14 · 406 阅读 · 0 评论 -
前端速学成财:第五课-图片也能"编译"?
1.CSS图片引用 2.NodeJs读取图片 3.把图片替换成Base64编码原创 2016-08-17 22:21:44 · 317 阅读 · 0 评论 -
前端速学成财:第六课-gulp快速上手
本节知识点: 1.快速理解gulp 2.安装和测试 3.执行我们第一个任务通过便面的”开脑”课时,我们会发现: 在前段开发过程中有很多事是我们”纯手工”很难或者很麻烦才能搞定的,因此需要借助一些优秀的第三方工具. 1.譬如JS文件的”编译”(这里还包含了不同语法的兼容) 2.JS和CSS的合并 3.文件的压缩 4.多人协作开发 5.即时运行和监听等生成package.json:np原创 2016-08-17 23:00:40 · 555 阅读 · 0 评论 -
前端速学成财:第十四课-实战演练:用gulp+webpack构建用户登录(1)
登录页面,基本要素如下: 1.页面展示 2.基本脚本判断 3.后端交互为了逼格,我们开始创建文件夹层级. 在项目根目录下创建src --main.js --tpl --login.html(后缀随意)注意:一旦发布到生成环境,以上文件是不需要上传到服务器上的1.利用我们之前学习的gulp-webpack把JS编译 2.利用gulp把tpl下面的文件生成到build/html原创 2016-08-19 17:38:37 · 619 阅读 · 1 评论