同步操作将从 happymmall/mmall-m 强制同步,此操作会覆盖自 Fork 仓库以来所做的任何修改,且无法恢复!!!
确定后同步将在后台操作,完成时将刷新页面,请耐心等待。
git clone git@gitee.com:happymmallmac/mmall-m.git
yarn / yarn install
yarn run dev /yarn run dev_win
生产模式 :
yarn run dist /yarn run dist_win
需求:用户 购买 后台 统计 运营 市场
核心:用户 购买
流程:展示 -> 购物车 -> 下单 -> 订单 -> 支付 -> 用户中心
功能拆分: 商品 :首页、商品列表、商品详情
购物车:购物车数量、添加删除商品、购物车提交
订单:订单确认(地址管理)、订单提交、订单列表、订单详情
支付:支付
用户:登录、注册、个人信息、找回密码、修改密码
项目 | 用户端 | 后台 |
---|---|---|
特点 | 要求稳定 用户类型多样 兼容性好 有SEO要求 多页应用 | 开发快 企业内部使用 不要求兼容性和SEO 单页应用 |
选型 | javascript + jquery + commonjs + hogan | html5 + css3 + sass + Bootstrap + React16 + React-Router4 + ES6 |
构建工具将源代码转换成可以执行的JavaScript、CSS、HTML 代码,用来让我们不再做机械重复的事情,解放我们的双手的。
项目 | Gulp | webpack |
---|---|---|
优点 | 好用又不失灵活,既可以单独完成构建,也可以和其他工具搭配使用 | 天生支持CommonJS,专注于处理模块化的项目,完整好用又不失灵活性; |
缺点 | 集成度不高,要写很多配置后才可以用 | 只能用于采用模块化开发的项目 |
选择 | × | √ |
毫无疑问,非git莫属
工具 | 构建工具 | 依赖环境 | 包管理 | 自动化发布脚本 | 代码编写 | 代码调试 | 请求挟持 | 版本控制 |
---|---|---|---|---|---|---|---|---|
名称 | webpack | NodeJS | NPM | Shell | sublime | chrome | charles/fiddler4 | git |
注:更新webpack@4.2.0后webpack-dev-server新增了devServer的配置,用自带的代理就可以访问接口
/*
* @Author: Lizh
* @Date: 2018-04-09 13:09:41
* @Last Modified by: Lizh
* @Last Modified time: 2018-05-16 23:04:43
*/
var config = {
serverHost:''
};
var _mm = {
// 网络请求
request : function(param){
var _this = this;
$.ajax({
type : param.method || 'get',
url : param.url || '',
dataType : param.type || 'json',
data : param.data || '',
success : function(res){
//登陆成功
if( 0 === res.status){
typeof param.success === 'function' && param.success(res.data , res.msg );
}
//无登陆状态需请求登陆
else if (10 === res.status){
_this.doLogin();
}
// 请求数据错误
else if (1 === res.status) {
typeof param.error === 'function' && param.error( res.msg );
}
},
error : function(err){
typeof param.error === 'function' && param.error( err.statusText );
}
});
},
// 获取服务器地址
getServerUrl:function(path) {
return config.serverHost+path;
},
//请求url参数
getUrlParam : function(name) {
var reg = new RegExp('(^|&)' + name + '=([^&]*)(&|$)');
var result = window.location.search.substr(1).match(reg);
return result ? decodeURIComponent(result[2]) : null;
},
//渲染html模板
renderHtml : function(htmlTemplate, data){
var template = Hogan.compile(htmlTemplate),
result = template.render(data);
return result;
},
//成功提示
successTips : function(msg){
alert(msg || '操作成功!');
},
//错误提示
errorTips : function(msg){
alert(msg || '哪里不对了~');
},
//字段的验证,支持非空、手机、邮箱的判断
validate : function(value, type){
var _value = $.trim(value);
//非空验证
if('require' === type){
return !!_value;
}
//手机号验证
if('phone' === type){
return /^1\d{10}$/.test(_value);
}
//邮箱格式验证
if('email' === type){
return /^(\w)+(\.\w+)*@(\w)+((\.\w{2,3}){1,3})$/.test(_value);
}
},
// 统一请求处理
doLogin :function() {
window.location.href = './user-login.html?redirect=' + encodeURIComponent(window.location.href);
},
//go home
goHome : function(){
window.location.href = './index.html';
}
};
module.exports = _mm;
文件 | html | js + css | image |
---|---|---|---|
位置 | www/admin. + 根域名 | s. + 根域名 | img. + 根域名 |
使用git bash远程连接服务器
安装git,可使用yum安装 :
yum install git
建立developer product 文件夹,拉取代码至developer
安装nginx :
yum install nginx
编写发布脚本前先手动执行一次,确保脚本准确
编写自动发布脚本 ####nginx和域名配置(这次没有进行域名分离)
新建vhost/*.conf并将其引入nginx.conf主文件
nginx配置域名
此处可能存在不合适展示的内容,页面不予展示。您可通过相关编辑功能自查并修改。
如您确认内容无涉及 不当用语 / 纯广告导流 / 暴力 / 低俗色情 / 侵权 / 盗版 / 虚假 / 无价值内容或违法国家有关法律法规的内容,可点击提交进行申诉,我们将尽快为您处理。