一、搭建开发环境

cnpm i -g bower

创建git仓库

cd webapp dir

git init

创建.bowerrc类文件技巧

null>.bowerrc

css预编译处理:less

常用语法:

定义变量

后代选择器

文件引用

函数

lesscss.cn

在线编译工具

tool.oschina.net/less

cnpm i --save-dev gulp gulp-clean gulp-concat gulp-connect gulp-cssmin gulp-imagemin gulp-less gulp-load-plugins gulp-uglify open

gulpfile.js

var gulp = require('gulp');
var $ = require('gulp-load-plugins')();
var open = require('open'); var app = {
srcPath: 'src/',
devPath: 'build/',
prdPath: 'dist/'
}; gulp.task('lib',function(){
gulp.src('bower_components/**/*.js')
.pipe(gulp.dest(app.devPath + 'vendor'))
.pipe(gulp.dest(app.prdPath + 'vendor'))
.pipe($.connect.reload());
}); gulp.task('html',function(){
gulp.src(app.srcPath + '**/*.html')
.pipe(gulp.dest(app.devPath))
.pipe(gulp.dest(app.prdPath))
.pipe($.connect.reload());
}); gulp.task('json',function(){
gulp.src(app.srcPath + 'data/**/*.json')
.pipe(gulp.dest(app.devPath + 'data'))
.pipe(gulp.dest(app.prdPath + 'data'))
.pipe($.connect.reload());
}); gulp.task('less',function(){
gulp.src(app.srcPath + 'style/**/main.less')
.pipe($.less())
.pipe(gulp.dest(app.devPath + 'css'))
.pipe($.cssmin())
.pipe(gulp.dest(app.prdPath + 'css'))
.pipe($.connect.reload());
}); gulp.task('js',function(){
gulp.src(app.srcPath + 'script/**/*.js')
.pipe($.concat('index.js'))
.pipe(gulp.dest(app.devPath + 'js'))
.pipe($.uglify())
.pipe(gulp.dest(app.prdPath + 'js'))
.pipe($.connect.reload());
}); gulp.task('image',function(){
gulp.src(app.srcPath + 'image/**/*')
.pipe(gulp.dest(app.devPath + 'image'))
.pipe($.imagemin())
.pipe(gulp.dest(app.prdPath + 'image'))
.pipe($.connect.reload());
}); gulp.task('build',['image','js','json','html','less','lib']); gulp.task('clean',function(){
gulp.src([app.devPath],[app.prdPath])
.pipe($.clean());
}); gulp.task('serve',['build'],function(){
$.connect.server({
root: [app.devPath],
livereload: true,
port: 5000
});
open('http://localhost:5000'); gulp.watch('bower_components/**/*.js',['lib']);
gulp.watch(app.srcPath + '**/*.html',['html']);
gulp.watch(app.srcPath + 'data/**/*.json',['json']);
gulp.watch(app.srcPath + 'style/**/*.less',['less']);
gulp.watch(app.srcPath + 'script/**/*.js',['js']);
gulp.watch(app.srcPath + 'image/**/*',['image']);
}); gulp.task('default',['serve']);

二、代码托管

CODE

先准备公钥

git add .

git commit -m ""

问题:refusing to merge unrelated histories

git pull origin master ----allow-unrelated-histories

git push git@code.csdn.net:Nyan007/webapp.git

AngularJS-webapp的更多相关文章

  1. angular-seed — AngularJS种子项目

    AngularJS Seed 是典型 AngularJS web 应用的应用骨架,可以快速启动你的 AngularJS webapp 项目和这些项目的开发环境. AngularJS Seed 包括一个 ...

  2. AngularJS搭建环境

    一.搭建环境 1.1 调试工具:batarang Chrome浏览器插件 主要功能:查看作用域.输出高度信息.性能监控 1.2 依赖软件:Node.js 下载:https://nodejs.org/e ...

  3. WebApp开发框架Ionic+AngularJS+Cordova

    目前的手机APP有三类:原生APP.WebAPP.HybridApp:HybridApp结合了前两类APP各自的优点,越来越流行. Ionic Ionic是一个新的.可以使用HTML5构建混合移动应用 ...

  4. Angularjs和Ionic框架搭建webApp

    本文原创版权归 简书作者 噜啦啦噜啦啦噜啦噜啦噜 所有,转载请联系作者获得授权,并于文章开头标注原创作者及出处,以示尊重! 文/噜啦啦噜啦啦噜啦噜啦噜(简书作者)原文链接:http://www.jia ...

  5. AngularJS学习笔记(三) 单页面webApp和路由(ng-route)

    就我现在的认识,路由($route)这个东西(也许可以加上$location)可以说是ng最重要的东西了.因为angular目前最重要的作用就是做单页面webApp,而路由这个东西是能做到页面跳转的关 ...

  6. angularjs之filter过滤器

    现在公司用ionic,就是基于angularjs封装了一些api用于webapp,最近用的angularjs的filter确实省了很多代码,现在总结一下! ng比较鸡肋的过滤器,这里就一笔带过吧!鸡汤 ...

  7. 2014年---移动端webapp个人年度总结

    我今年是由零基础开始入门的,刚好我第一家公司入职后就马上让我接手做ipad版的专题app了.(一入门就是移动端开发,是幸运也是艰辛的开始). 我是自学前端的,当然,对Bootstrap,JQuery  ...

  8. [整理]AngularJS移动端开发遇到的问题

    最近在开发一个移动WebAPP的小项目,因为之前一直使用AngularJS, 对于这个项目,废话不多说,拿过来就用上了. 开发过程是一路通畅和舒服的,但是,却忽略了一个非常重要的问题,移动2G环境下的 ...

  9. 搭建 AngularJS+Ionic+Cordova 开发环境并运行一个demo

    目前的手机APP有三类:原生APP,WebAPP,HybridApp:HybridApp结合了前两类APP各自的优点,越来越流行. Cordova就是一个中间件,让我们把WebAPP打包成Hybrid ...

  10. 自定义angularjs分页控件

    继昨天写了knockoutjs+ jquery pagination+asp.net web Api 实现无刷新列表页 ,正好最近刚学习angularjs ,故琢磨着写一个angularjs版本的分页 ...

随机推荐

  1. 【C语言】linux C写入本地文件

    //定义写入文件 FILE *pFile; //定义文件路径变量 ]; //变量赋值 sprintf(local_file,"/tmp/test.json"); //打开文件 pF ...

  2. [转] CentOS---网络配置详解

    原文地址: http://blog.chinaunix.net/uid-26495963-id-3230810.html 一.配置文件详解在RHEL或者CentOS等Redhat系的Linux系统里, ...

  3. 运行jupyter notebook 出错 Error executing Jupyter command 'notebook'

    实际上是安装jupyter时候有错误, 仔细看日志发现需要缺少 Microsoft Visual C++ Compiler for Python 2.7 下载安装后,重新安装jupyter即可 htt ...

  4. Python基础之socket编程(Day29)

    一.客户端/服务器架构 1.硬件c/s架构(打印机) 2.软件c/s架构 互联网中处处是c/s架构 浏览的网页就是如此 C/S架构与socket的关系 socket就是为了完成c/s架构的开发 二.s ...

  5. 设置linux下shell显示不同颜色的字体

    实例代码如下: #!/bin/bash clear echo -e "\033[1m Hello World" # bold effect echo -e "\033[5 ...

  6. Python 8 协程/异步IO

    协程 协程,又称微线程,纤程.英文名Coroutine.一句话说明什么是线程:协程是一种用户态的轻量级线程. 协程拥有自己的寄存器上下文和栈.协程调度切换时,将寄存器上下文和栈保存到其他地方,在切回来 ...

  7. 一些逼格略高的 js 片段

    // 一个接一个运行 // timeout 不能直接放在 for 里面,暂时不知道为什么 function functionOneByOne(fn, times, duration) { for(va ...

  8. Python编程-编码、文件处理、函数

    一.字符编码补充知识点 1.文本编辑器存取文件的原理(nodepad++,pycharm,word) 打开编辑器就打开了启动了一个进程,是在内存中的,所以在编辑器编写的内容也都是存放与内存中的,断电后 ...

  9. library-type:fr-unstanded vs fisrt-stand vs second-stanrd

    建库时是否是链特异性建库. Tophat2: --library-type The default is unstranded (fr-unstranded). If either fr-firsts ...

  10. 【转载】Android端百度地图API使用详解

    转载地址:http://www.cnblogs.com/rocomp/p/4994110.html 百度地图API简介 百度地图移动版API(Android)是一套基于Android设备的应用程序接口 ...