一、搭建开发环境

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. TLS and SSL

    SSL:(Secure Socket Layer,安全套接字层),位于可靠的面向连接的网络层协议和应用层协议之间的一种协议层.SSL通过互相认证.使用数字签名确保完整性.使用加密确保私密性,以实现客户 ...

  2. 做测试时,启动SpringBoot出现警告,在ClassPath中一个类多次出现

    Found multiple occurrences of org.json.JSONObject on the class path: jar:file:/C:/Users/niaomingjian ...

  3. 【数学建模】MATLAB学习笔记——函数式文件

    MATLAB学习笔记——函数式文件 引入函数式文件 说明: 函数式文件主要用于解决计算中的参数传递和函数调用的问题. 函数式的标志是它的第一行为function语句. 函数式文件可以有返回值,也可以没 ...

  4. windows通过ftp下载linux文件

    # windows 下载 linux的文件>> ftp <domain_or_ip>>> <input_username>>> <in ...

  5. InnoDB存储引擎内存缓冲池管理技术——LRU List、Free List、Flush List

    InnoDB是事务安全的MySQL存储引擎,野山谷OLTP应用中核心表的首选存储引擎.他是基于表的存储引擎,而不是基于数据库的.其特点是行锁设计.支持MVCC.支持外键.提供一致性非锁定读,同时被设计 ...

  6. Linux文件系统管理 文件系统

    概述 文件系统:文件系统这个名词大家都很陌生,不过如果说成分区,大家就比较容易理解了.原先每个分区只能格式化为一个文件系统,所以我们可以认为文件系统就是指分区.不过随着技术的进步,现在一个文件系统可以 ...

  7. [APIO2013]机器人

    题目描述 VRI(Voltron 机器人学会)的工程师建造了 n 个机器人.任意两个兼容的机 器人站在同一个格子时可以合并为一个复合机器人. 我们把机器人用 1 至 n 编号(n ≤ 9).如果两个机 ...

  8. Squid 安装

    Squid简介 Squid是比较知名的代理软件,它不仅可以跑在linux上还可以跑在windows以及Unix上,它的技术已经非常成熟.目前使用Squid的用户也是十分广泛的.Squid与Linux下 ...

  9. golang注册码

    许可证服务认证 由于更新,最近注册码都不能用了,下面是能用的, http://idea.youbbs.org

  10. 解决MySQL因不能创建 PID 导致无法启动的方法

    问题描述 MySQL 启动报错信息如下: ? 1 2 Starting mysqld (via systemctl):  Job for mysqld.service failed because t ...