使用amaze ui模板全过程
amaze ui基于gulp构建,所以现在安装gulp需要的环境,gulp使用npm安装,npm基于node.js 所以一切从node.js开始
1 下载对应的node.js
打开 https://nodejs.org/en/download/ 自己对应的系统,下载
2 对下载完毕的文件进行安装
windows一路点击next 慢慢等待就完毕!
在命令行下输入 node 如果有交互提示 表示安装成功
如果没有则查看系统变量Path,把path配置上去。
3 创建测试代码 进一步测试
文件名 t.js
var http = require("http");
http.createServer(function(request, response) {
response.writeHead(200, {"Content-Type": "text/plain"});
response.write("test nodjs");
response.end();
}).listen(8899);
console.log("nodejs start listen 8899 port!");
进入命令行下 找到t.js存储的路径 运行 node t.js
浏览器中打开,也成功!
4 配置npm的全局路径
Windows下的Nodejs npm路径是appdata,可能不是我们想要的路径,可以改成我们指定的路径方便管理。
在cmd下执行以下命令
npm config set cache “D:\nodejs\node_cache”
npm config set prefix “D:\nodejs\node_global”
如果命令无效,可以去nodejs的安装目录中找到node_modules\npm\npmrc文件,这个文件存放npm的userconfig配置。
修改如下即可:
prefix = D:\nodejs\node_global
cache = D:\nodejs\ node_cache
5 全局安装gulp
命令行下输入
npm install -g gulp
然后输入gulp -v,如果提示不是内部或外部命令,说明没有配置系统变量path,手动去配置pasth,地址是prefix的地址。
6 本地安装gulp
建立项目,创建Gulpfile.js和package.json文件,在项目目录
运行命令npm install gulp –save-dev,安装本地gulp。
安装完毕!打开基于gulp的项目amaze ui的模板可正常查看
7. gulp的实施与使用
创建工作目录与发布目录
工作目录:即没有经过压缩合并等处理的文件存放目录。
发布目录:即项目发布所引用的文件目录地址,这里的文件是经过gulp压缩合并等处理后生成的文件,处理过后的名字可以自定义,也可以不处理即与未处理文件名相同。
使用amaze ui模板全过程的更多相关文章
- 十、VueJs 填坑日记之在项目中使用Amaze UI
上一篇博文,我们把jQuery集成到了项目中,今天我们来集成Amaze ui(妹子UI).先来介绍一下妹子UI.Amaze UI 含近 20 个 CSS 组件.20 余 JS 组件,更有多个包含不同主 ...
- js插件---Amaze UI dialog如何使用
js插件---Amaze UI dialog如何使用 一.总结 一句话总结:别人给你列出来的参考手册照着用先 1.在哪里去找插件参考资料或者使用手册(一般位置找不到的时候)? github上面啊,非常 ...
- Amaze UI 模版中心上线丨十几款高质量优秀模版免费提供!
Amaze UI模版中心终于上线了,目前汇聚了包含企业门户.新闻资讯.管理后台等多个领域的模版,全都可以免费下载. Amaze UI模版中心后续还会增加更多的模版以及领域,请各位持续关注. 模版中心的 ...
- 幻灯片插件FlexSlider -- Amaze UI幻灯片参数
用了Amaze UI 的人就知道,其幻灯片插件是 data-am-slider='{}'来传参数的:(以下代码来自Amaze UI 官网) <div data-am-widget="s ...
- 目前几款基于html5的前端框架:如Bootstrap、Foundation、Semantic UI 、Amaze UI
Bootstrap是由Twitter在2011年8月推出的开源WEB前端框架,集合CSS 和HTML,使用了最新的浏览器技术,为快速WEB开发提供了一套前端工具包,包括布局.网格.表格.按钮.表单.导 ...
- android自定义UI模板图文详解
不知道大家在实际开发中有没有自定义过UI模板?今天花时间研究了一下android中自定义UI模板,与大家分享一下. 每个设计良好的App都是自定义标题栏,在自定义标题栏的过程中大部分人可能都是自定义一 ...
- DoNet开源项目-基于Amaze UI的点餐系统
帮朋友做的点餐系统,主要是为了让顾客在餐桌上,使用微信扫描二维码,就可以直接点菜,吃完使用微信付款. 系统演示地址,账户名和密码均为:admin.(请不要删除admin用户) GitHub Clone ...
- 有了bootstrap,为什么还要做amaze ui
1.Bootstrap介绍Bootstrap,来自 Twitter,是目前很受欢迎的前端框架.Bootstrap 是基于 HTML.CSS.JAVASCRIPT 的,它简洁灵活,使得 Web 开发更加 ...
- 移动端 前端框架 amaze ui
移动端 前端框架 amaze ui http://amazeui.org/?_ver=2.x
随机推荐
- poj-1239(递推关系)好难
#include <iostream> #include <algorithm> #include <cstring> #include <cstdio> ...
- About DOM
文档对象模型,简称DOM.是HTML页面结构给javascript提供的一个入口,它就像一个桥梁,连接两者的关系.通过DOM,JavaScript拥有访问并修改HTML的权限. 一.DOM模型: 首先 ...
- django所遇到问题简单总结
问题虽小,但却值得深思 一.改mysql密码 方法1: 用SET PASSWORD命令 首先登录MySQL. 格式:mysql> set password for 用户名@localhost = ...
- Windows环境下搭建Nginx和多版本PHP共存
PHP版本众多,彼此之间兼容性不好,不同程序经常需要的不同版本的PHP版本.这里介绍如何使用NGINX让不同版本的PHP共存. 软件下载地址 与nginx整合的php需要选择Non Thread Sa ...
- BC32(hdu5182~5185)
恩……又是一个悲伤的故事,然后BC做出来一题,因为自己傻逼,可能紧张,也可能是其他,反正没看全题目就敲,敲完WA,WA完改,改完WA,没了……大概五十几分钟WA了五法,然后问了才知道没看全,就这样,后 ...
- Thrift 个人实战--初次体验Thrift(转)
前言: Thrift作为Facebook开源的RPC框架, 通过IDL中间语言, 并借助代码生成引擎生成各种主流语言的rpc框架服务端/客户端代码. 不过Thrift的实现, 简单使用离实际生产环境还 ...
- oracle之 手动创建 emp 表 与 dept 表
说明: 有时候我们需要通用的实验数据,emp表 与 dept表 但是数据库中有没有. 这时,我们可以手动创建. -- 创建表与数据CREATE TABLE EMP(EMPNO NUMBER(4) N ...
- Oracle Supplemental 补全日志介绍
转. Oracle补全日志(Supplemental logging)特性因其作用的不同可分为以下几种:最小(Minimal),支持所有字段(all),支持主键(primary key),支持唯一键( ...
- POJ2955Brackets——dp
题目:http://poj.org/problem?id=2955 1.考虑区间. 2.当前区间可为自己子区间的和(题意果然是和而非最大值). 3.考虑当前区间的边界. #include<ios ...
- Vue基础汇总实践
1)双向绑定: <div id="app"> <p>{{message}}</p> <input v-model=" ...