Web_QiCaiYao/pc

CRMEB pc模板

开发规范

市面上常用的命名规范：

• camelCase（小驼峰式命名法 —— 首字母小写）
• PascalCase（大驼峰式命名法 —— 首字母大写）
• kebab-case（短横线连接式）
• snake_a（下划线连接式）

项目文件命名

#####1、项目名 #####全部采用小写方式， 以下划线分隔。 例：crmeb_pro_pc； #####2、组件（components） #####优先选择单个单词命名，多个单词命名以小驼峰式命名。例：crmebPro； #####3、pages里面的文件名； #####全部采用小写方式， 优先选择单个单词命名，多个单词命名以下划线分隔。 例：crmeb_pro_pc； #####4、css文件名； #####全部采用小写方式， 优先选择单个单词命名，多个单词命名以短横线分隔。例：crmeb-pro.css #####5、JavaScript 文件名； #####全部采用小写方式， 优先选择单个单词命名，多个单词命名以短横线分隔。例：crmeb-pro.js #####6、HTML 文件名； #####全部采用小写方式， 优先选择单个单词命名，多个单词命名以下划线分隔。例：crmeb_pro.html #####7、图像文件名； #####全部采用小写方式， 优先选择单个单词命名，多个单词命名以短横线分隔。例：crmeb-pro.jpg

目录结构

主要目录结构及说明：

├── assets                    # 图片、小图标自、css等静态资源
│   ├── css                   # css样式文件
│   ├── iconfont              # 小图标
│   ├── images                # 图片
│   └── theme                 # element的scss样式
│   ├── components            # 公共组件
│   │    └──ChatRoom          # 客服
│   │    └──countDown         # 倒计时
│   │    └──ffVip             # 扫码激活付费会员
│   │    └──footers           # 底部导航
│   │    └──headers           # 头部导航
│   │    └──hotGoods          # 热销推荐
│   ├── layouts               # 布局
│   ├── libs                  
│   │    └──socket            # 检测长链接
│   ├── middleware            # 中间插件
│   ├── mixins                # 通用混合
│   │    └──appChat          # 客服插件
│   │    └──SendVerifyCode  # 获取验证码
│   ├── pages                 # 所有页面
│   │    └──goods_detail      # 商品详情
│   │    └──user              # 个人中心
│   │         └──address_list # 地址列表
│   │         └──balance      # 我的余额
│   │         └──collect      # 我的收藏
│   │         └──index        # 账户管理
│   │         └──messageCenter# 站内信
│   │         └──myCoupon     # 我的优惠券
│   │         └──orderList    # 订单列表
│   │         └──refundList   # 退款列表
│   │         └──userCoupon   # 领取优惠券
│   │    └──alipay             # 支付页
│   │    └──AppChat            # 客服页
│   │    └──evaluation         # 商品评价
│   │    └──goods_cate         # 应用
│   │    └──goods_list         # 商品列表
│   │    └──goods_presell      # 预售列表
│   │    └──goods_search       # 商品搜索
│   │    └──goods_seckill      # 秒杀列表
│   │    └──goods_seckill_detail # 秒杀详情
│   │    └──index              # 首页
│   │    └──login              # 登录页
│   │    └──logistics          # 物流详情
│   │    └──order_confirm      # 确认订单
│   │    └──order_detail       # 订单详情
│   │    └──payment            # 去支付
│   │    └──refund             # 申请退款
│   │    └──refund_goods       # 退款订单
│   │    └──shoppingCart       # 购物车
│   │    └──user               # 个人中心
│   │    └──wxPay              # 微信支付
│   ├── plugins                # 插件
│   ├── static                 # 静态文件
│   ├── store                  # Vuex 状态管理
│   ├── utils                  # js工具
│   ├── setting_dev.js         # 开发配置文件
│   ├── setting.js             # 业务配置文件
├── package.json               # 插件集合
└── nuxt.config.js             # 配置文件以及插件引入文件

开发打包项目

# 进入项目目录
$ cd crmeb_pro_pc

# 安装依赖
$ npm install

# 启动项目(本地开发环境)
$ npm run dev

# 打包项目
静态部署
$ npm run generate
单页面
$ npm run build