• 前端项目构建之yeoman


    各位好啊,我又和大家见面了,也许你已经不记得大明湖畔的容嬷嬷,但是只要记得博客园中的我就好,希望我的博客能像一股清风,为你驱散炎热的酷暑,好了,废话不多说,开始上干货,我今天带给大家的是前端工程化开发yeoman,bower ,grunt .###

    关于这三个工具在这里就不过多介绍了,没有用过的散仙们可以自行访问各自的官网进行了解

    1. yeoman(脚手架工具):http://yeoman.io/
    2. bower(包管理工具): http://bower.io/
    3. grunt(构建工具):http://www.gruntjs.net/

    一:准备工作##

    由于这三个工具都是需要利用npm包下载的,所以需要安装node.js进入到node.js官网https://nodejs.org/en/你会看到两个绿色的大按钮,选择稳定版本的node.js安装就行,安装过程就不细说了,全程傻瓜式安装,下一步,下一步。。就行了,当你安装完node的时候,说明我们已经成功了三分之一,还有三分之二需要我们去完成。剩下的三分之二也是本次讲解的干货,希望对各位能够有所帮助。好了,干货走起,敌军还有三十秒到达战场,碾碎他们。

    1.安装完node后打开终端输入node -v 出现下图则说明安装成功。


    2.安装git

    Git 是 Linus Torvalds 为了帮助管理 Linux 内核开发而开发的一个开放源码的版本控制软件。Yeoman自动构建项目时会用到该软件,所以我们先安装好。到Git官网http://git-scm.com/download/上下载并安装,安装过程和node一样遵循傻瓜式安装

    3.安装yeoman,grunt,bower
     在命令提示符中运行npm install -g yo grunt-cli bower

    4.安装generator在命令行输入yo

    5.使用yeoman构建项目,俗话说养兵xx,用兵xx,(ps:原谅我语文是体育老师教的,忘记那句话咋说的了)

      创建一个工作目录,用于存放Yeoman项目。我在D盘下新建Angular的app工作目录,命令行进入,输入yo命令,用上下键选择webapp

    这里我们不选择Sass,因为需要Sass的话运行环境是Ruby,在windows下配置会非常麻烦;选择bootstrap;不选择Modernizr;点击回车,经过几屏的信息滚动后,会提示项目构建完成,文件目录如下:

    app 为项目主目录,是部署的根目录

    node_modules 为 nodejs的包文件

    test 为测试目录,专门用于单元测试,用的是 mocha 来测试

    Gruntfile.js 是配置 grunt 自动化任务的配置文件,具体配置可以参考下 Grunt官网

    就这样,一个项目就搭建好了,下一次我将会为大家详细说明grunt 的用法,这个是重点,难点,拿着笔点着字 这个考试要考的。。(哈哈本章节到此结束,欲知后事如何,敬请期待下集)顺便推广下一个前端开发群474471759

    如果有错,请大神及时反馈给我,不要让我错下去,谢谢!敬礼#

  • 相关阅读:
    求数列的和
    统计字符
    保留最大的数
    POJ百练—IP地址转换
    HDOJ1213(并查集)
    HDOJ1059(多重背包)
    HDOJ1171(多重背包)
    多重背包(标准模板)
    HDOJ1251(前缀匹配---分块查找&map应用)
    hdoj1113(字符串map应用)
  • 原文地址:https://www.cnblogs.com/dreamsboy/p/5769311.html
Copyright © 2020-2023  润新知