Window下搭建foundation apps环境

框架:AngularJS、Foundation,

构建工具:Gulp,

开发环境:node.js。

操作系统:windows

(一)环境准备

1 安装node.js

1.1 安装最新版本(0.12.7),安装时请选中“add to path” 选项

1.2 设置淘宝镜像,打开 cmd窗口,输入以下命令

npm config set registry=http://registry.npm.taobao.org/

npm config set loglevel=http

如果安装不成功,可安装cnpm:

npm install -g cnpm --registry=https://registry.npm.taobao.org

1.3 打开cmd,窗口,输入npm -v 检查是否安装成功

2 安装Git

2.1 设置Git环境变量,右击“我的电脑”->“属性”->"高级系统设置"->“环境变量”->“系统变量” 下找到path,加入git的安装目录

C:\Program Files (x86)\Git\bin;

2.2 打开cmd,窗口,输入git --version 检查是否安装成功

3 安装Python

3.1 必须是2.7-3.0 之间的版本(本人安装的是python-2.7.10.amd64),安装时选中“add to path” 选项

3.2 打开cmd,窗口,输入python 检查是否安装成功

4 安装Ruby(可选)

(二)创建项目

(1) 安装所需要的工具:yo,gulp和bower,

npm install -g yo gulp bower

(2) 安装generator-gulp-angular:

npm install -g generator-gulp-angular

(3) 在项目根目录下安装node-sass

npm install node-sass

如果报错Error : ”msbuild” failed with exit code:1...

则安装VS Express 2013 for Desktop,

网址为:http://www.yalewoo.com/vs_2013_express.html

重复安装node-sass,若不行则全局安装:npm install -g node-sass

如果全局安装失败,node-sass  -v找到全局安装目录,可以把bode-sass文件拷在全局安装目录下

(4) 如果已经取得完整项目,可直接在项目根目录下运行。

gulp serve

以启动网站

(5) 创建项目,如果不需要指定项目名称,app-name可以不写,默认使用当前目录名作为项目名称

yo gulp-angular [app-name]

(6) 项目创建过程中会要求选择配置项,如是否需要jquery,sass,bootstrap,foundation等,根据实际需要选择。一般情况下选择:

Version of Angular:  1.5.x(stable)

Angular Modules:  angualr-animate.js

jQuery or perhaps Zepto:  jQuery 2.x

Use a REST resource library:  ngResource

Router:  UI Router

UI framework:  Foundation

Foundation components: The official jQuery implementation of Foundation

CSS preprocessor:  Sass(Node)

JS preprocessor:  None

HTML template engine:  None

(7) 运行项目

gulp serve

如果运行的时候报错:

Error:Missing binding D:\workspace\ABC\node_modules\node-sass\vendor\win32-64-48

\binding.node

其中ABC为项目文件夹

直接在该目录下放置binding.node,再运行即可

时间: 2024-10-13 11:37:38

Window下搭建foundation apps环境的相关文章

window下搭建c开发环境(GNU环境的安装)

一.在windows平台上安装GNU环境 windows操作系统不自带GNU环境,如果需要开发跨平台的C语言程序,那么需要给windows安装GNU环境 windows下的两款GNU环境:MinGW和Cygwin MinGW:完全面向windows平台的GNU环境 Cygwin:相对于吧linux平台的api做了一个完整的拷贝,因此Cygwin比较庞大,并且在Cygwin环境下编译出来的程序运行速度比较慢,因为他会先去执行linux平台的api,然后在windows平台上做了一个映射,在中间经过

2015/4/28~window下搭建node开发环境

1.安装nodejs 下载匹配自己电脑的node版本,并双击安装 在控制台,输入命令:node -v验证是否安装成功 2.安装express 在控制台npm install express 在控制台,输入命令:express -V验证是否安装成功 3.IDE推荐webstorm

Windows环境下搭建Objective-C开发环境

Windows环境下搭建Objective-C开发环境 目前来说,如果真的想用Xcode来运行Objective-C程序,那么可以用虚拟机装Mac OS X或者装黑苹果(在PC机上安装苹果的系统,不建议),不过这两种方式都有些麻烦,以下介绍GNUstep以及Code blocks来实现,具体方法如下. 在我的云盘下载所需工具:链接: http://pan.baidu.com/s/1i34b8wP 密码: wd9e 解压后按照一下顺序进行安装 gnustep-core-0.28.0-setup.e

mac os 下搭建android开发环境

mac os 下搭建android开发环境 周银辉 mac os 下搭建android环境比较方便, 如下几个步骤: 1,安装jdk 先搞清楚自己是否已经安装,在命令行下:java -version,如何有版本信息输出,则已经安装了,比如我的 192% java -version java version "1.8.0_05" Java(TM) SE Runtime Environment (build 1.8.0_05-b13) Java HotSpot(TM) 64-Bit Ser

Ubuntu 下搭建 Android 开发环境

网上的N多教程全是Windows平台的,而Google官网是推荐用Ubuntu开发Android,很多朋友也是用Linux的系统开发的,下面我介绍下在Linux下Android开发环镜的搭建. 一.Linux 下安装配置 JDK 自从Oracle收购Sun近三年来,已经有很多变化.早在8月,甲骨文将"Operating System Distributor License for Java"许可证终结,这意味着第三方将不可以依据这一许可分发他们的软件包.因此Ubuntu Linux已经

mac 下搭建 Android 开发环境

因工作需要,要在mac 下搭建 Android 开发环境.谷歌.度娘了好久,没有找个一个完整又系统的方法,很是苦恼.最终,皇天不负有心人,找到了下面这篇文档,特此记录.也为有这方面需求的朋友提供个方便. 首先我们需要知道开发安卓的环境由以下几个组件组成:Java虚拟机JDK.Eclipse.Eclipse插件ADT(Android Developer Tool)和Android开发包SDK.下面就和大家一起学习如何来快速的,适合新手的搭建方式吧! 方法/步骤 因为系统自带jdk,所以就不用在下载

龙芯8089D-Debian7 下搭建 Objective-C 编译环境

龙芯8089D-Debian7 下搭建 Objective-C 编译环境 目录 安装相关文件 编译参数说明 简化命令行参数 实际编译实例 简单说明:Objective-C 的 C 文件后缀为 .m,头文件后缀为 .h,例如我们在本教程中的例程就是 main.m. 安装相关文件 需要安装这些包:gcc.g++.gobjc.gnustep.gnustep-devel.gnustep-gui-dev.libgnustep-base-dev. 安装命令很简单: apt-get install gcc g

Windows下搭建PHP开发环境

Windows下搭建PHP开发环境 一.准备工作-所需软件 ·   Apache  \php\httpd-2.2.25-win32-x86-no_ssl.msi ·   PHP \php\php-5.3.1-Win32-VC6-x86.zip ·   Oracle client 10g\php\client 二.安装软件 安装Apache: 双击安装,与安装其他Windows软件没有什么区别,在填Server Infomation时,并没有特殊规定,只要输入的信息符合格式即可. 安装完成之后,在

ubuntu下搭建android开发环境之超顺畅模拟器

如果说android系统的卡,像耳边蚊子让人抓狂,那么android模拟器的卡,那就像午睡时的苍蝇.大概就是一样的恶心~~ 那么,这样的问题对于开发者肯定忍无可忍,我也一样,虽然我还没有入门,但我也一样纠结,为什么会这么卡??这么卡?我是i5 4G内存啊~~ 解决: 第一种解决方法(也算是比较直接,比较烧包的办法): 用真机调试~方法上篇文章有谈论,请看ubuntu下搭建android开发环境: 烧包原因:我不能兼容每个系统版本,每种型号机器,每种屏幕大小,都去搞台真机对吧~ 第二种解决方法: