Slush是一个用于构建丰富Web应用的脚手架工具,它类似于非常流行的工具Yeoman,但拥有自己独特的命令和生成器。需要注意的是,Slush本身并不提供项目功能,而是提供了一套工具和约定,以确保项目开发过程中的一致性。Slush的一个主要特点是它使用Gulp进行项目构建,为开发者提供了流式构建系统的强大优势,而无需手动管理组件。
如果熟悉Grunt,那么理解Gulp将会非常容易,会发现它比Grunt更简单。即使不熟悉Grunt,也会简要解释。但在那之前,让先来看看生成器。
如果之前使用过Eclipse或Visual Studio,可能已经注意到这些IDE中预装的项目模板。这些模板为提供了一个基本结构,可以从这个结构开始构建项目。生成器的概念与此非常相似,它们使用不同的工具(例如Bootstrap、AngularJS、Bower等)帮助构建一个传统的项目结构。另外,也可以使用生成器为现有项目添加组件。Slush为提供了多种生成器选项,以满足项目的需求。此外,还可以创建自己的生成器以满足需求。
Gulp是一个任务运行器,可以帮助自动化大部分重复的开发任务。Slush使用Gulp以非常简单的方式创建生成器,因为Gulp本身不需要太多的配置。Gulp提供了许多插件和模板,使用gulp-template、gulp-install等命令生成应用程序。为了简化Gulp作为生成器的使用,Slush提供了帮助。使用Slush,不需要担心其他所需的配置,只需坐下来让它与Gulp一起工作。
先决条件: 1. 基本的终端或bash或命令提示符知识 2. 系统中安装了NodeJS
安装:
首先,需要Node.js来设置Slush和其他重要的包。如果还没有安装Node,可以在这里找到它:。安装完成后,通过输入以下命令检查安装:npm -v
。如果npm已安装,应该得到npm的版本检查,否则请尝试重新安装。
安装完成后,使用npm全局安装Slush CLI:
npm install -g slush
等待几分钟,因为它会在本地lib中安装一堆东西。为了验证安装,输入以下命令:slush -v
。它将立即显示系统中安装的Slush版本。
另外,可以与Slush一起安装gulp和bower CLI,或者手动安装以备将来使用。
Bower是一个客户端包管理器,主要用于管理像Bootstrap、JavaScript框架和库等包。
npm install -g slush gulp bower
查找和安装生成器:
之前的命令是Slush的基本设置。接下来,Slush有一个由其出色的社区成员开发的生成器集合。可以在这里查看生成器:,并选择最适合需求的生成器。angular-gulp生成器非常受欢迎,所以让安装这个生成器并构建一个项目。安装任何生成器的简单语法是:npm install -g slush-<generator-name>
npm install -g slush-angular-gulp
构建Angular应用:
创建一个新的空项目文件夹,然后输入以下命令。这将带完成整个构建过程,并为创建所有必要的文件夹和文件。
slush angular-gulp
接下来,Slush会问一系列交互式问题,以帮助仔细选择项目依赖。不需要做任何配置,只需回答问题,然后坐下来放松。很棒,不是吗?查看下面的截图了解构建过程。