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模板全过程的更多相关文章

  1. 十、VueJs 填坑日记之在项目中使用Amaze UI

    上一篇博文,我们把jQuery集成到了项目中,今天我们来集成Amaze ui(妹子UI).先来介绍一下妹子UI.Amaze UI 含近 20 个 CSS 组件.20 余 JS 组件,更有多个包含不同主 ...

  2. js插件---Amaze UI dialog如何使用

    js插件---Amaze UI dialog如何使用 一.总结 一句话总结:别人给你列出来的参考手册照着用先 1.在哪里去找插件参考资料或者使用手册(一般位置找不到的时候)? github上面啊,非常 ...

  3. Amaze UI 模版中心上线丨十几款高质量优秀模版免费提供!

    Amaze UI模版中心终于上线了,目前汇聚了包含企业门户.新闻资讯.管理后台等多个领域的模版,全都可以免费下载. Amaze UI模版中心后续还会增加更多的模版以及领域,请各位持续关注. 模版中心的 ...

  4. 幻灯片插件FlexSlider -- Amaze UI幻灯片参数

    用了Amaze UI 的人就知道,其幻灯片插件是 data-am-slider='{}'来传参数的:(以下代码来自Amaze UI 官网) <div data-am-widget="s ...

  5. 目前几款基于html5的前端框架:如Bootstrap、Foundation、Semantic UI 、Amaze UI

    Bootstrap是由Twitter在2011年8月推出的开源WEB前端框架,集合CSS 和HTML,使用了最新的浏览器技术,为快速WEB开发提供了一套前端工具包,包括布局.网格.表格.按钮.表单.导 ...

  6. android自定义UI模板图文详解

    不知道大家在实际开发中有没有自定义过UI模板?今天花时间研究了一下android中自定义UI模板,与大家分享一下. 每个设计良好的App都是自定义标题栏,在自定义标题栏的过程中大部分人可能都是自定义一 ...

  7. DoNet开源项目-基于Amaze UI的点餐系统

    帮朋友做的点餐系统,主要是为了让顾客在餐桌上,使用微信扫描二维码,就可以直接点菜,吃完使用微信付款. 系统演示地址,账户名和密码均为:admin.(请不要删除admin用户) GitHub Clone ...

  8. 有了bootstrap,为什么还要做amaze ui

    1.Bootstrap介绍Bootstrap,来自 Twitter,是目前很受欢迎的前端框架.Bootstrap 是基于 HTML.CSS.JAVASCRIPT 的,它简洁灵活,使得 Web 开发更加 ...

  9. 移动端 前端框架 amaze ui

    移动端 前端框架 amaze ui http://amazeui.org/?_ver=2.x

随机推荐

  1. poj-1239(递推关系)好难

    #include <iostream> #include <algorithm> #include <cstring> #include <cstdio> ...

  2. About DOM

    文档对象模型,简称DOM.是HTML页面结构给javascript提供的一个入口,它就像一个桥梁,连接两者的关系.通过DOM,JavaScript拥有访问并修改HTML的权限. 一.DOM模型: 首先 ...

  3. django所遇到问题简单总结

    问题虽小,但却值得深思 一.改mysql密码 方法1: 用SET PASSWORD命令 首先登录MySQL. 格式:mysql> set password for 用户名@localhost = ...

  4. Windows环境下搭建Nginx和多版本PHP共存

    PHP版本众多,彼此之间兼容性不好,不同程序经常需要的不同版本的PHP版本.这里介绍如何使用NGINX让不同版本的PHP共存. 软件下载地址 与nginx整合的php需要选择Non Thread Sa ...

  5. BC32(hdu5182~5185)

    恩……又是一个悲伤的故事,然后BC做出来一题,因为自己傻逼,可能紧张,也可能是其他,反正没看全题目就敲,敲完WA,WA完改,改完WA,没了……大概五十几分钟WA了五法,然后问了才知道没看全,就这样,后 ...

  6. Thrift 个人实战--初次体验Thrift(转)

    前言: Thrift作为Facebook开源的RPC框架, 通过IDL中间语言, 并借助代码生成引擎生成各种主流语言的rpc框架服务端/客户端代码. 不过Thrift的实现, 简单使用离实际生产环境还 ...

  7. oracle之 手动创建 emp 表 与 dept 表

    说明: 有时候我们需要通用的实验数据,emp表 与 dept表  但是数据库中有没有. 这时,我们可以手动创建. -- 创建表与数据CREATE TABLE EMP(EMPNO NUMBER(4) N ...

  8. Oracle Supplemental 补全日志介绍

    转. Oracle补全日志(Supplemental logging)特性因其作用的不同可分为以下几种:最小(Minimal),支持所有字段(all),支持主键(primary key),支持唯一键( ...

  9. POJ2955Brackets——dp

    题目:http://poj.org/problem?id=2955 1.考虑区间. 2.当前区间可为自己子区间的和(题意果然是和而非最大值). 3.考虑当前区间的边界. #include<ios ...

  10. Vue基础汇总实践

    1)双向绑定:   <div id="app">   <p>{{message}}</p>   <input v-model=" ...