store vue
1.0.0
تم إنشاء موقع الويب بالكامل باستخدام vue، وvuex، وvue-router، وaxios، وESLint، وES6، وما إلى ذلك. ويتكون الموقع بأكمله من الصفحة الرئيسية لموقع الويب، وصفحة تصنيف المنتج، وصفحة التسجيل، وصفحة تسجيل الدخول، وصفحة عرض معلومات المنتج، وصفحة تصفية المنتج، عربة التسوق وصفحة التسوية، يتضمن الموقع بأكمله وظائف مثل إضافة صفحات الويب إلى المفضلة، والبحث بالكلمات الرئيسية، ودائرة الصور، وتبديل قائمة فئة المنتج، وتصفية المنتج، وتقديم المنتج، والاستشارة حول المنتج، والربط ثلاثي المستويات بين المقاطعات والبلديات، والعدسة المكبرة ، التسجيل، تسجيل الدخول، الخ.
http://meishadevs.com/store-vue/#/
# 将项目克隆到本地
git clone https://github.com/meishadevs/store-vue.git
# 进入 store-vue 目录下
cd store-vue
# 安装依赖
npm install
# 运行项目
npm run dev
# 编译并压缩代码用于发布，将编译后生成的dist文件夹放在服务器下即可访问
npm run build
├── public // 不需要打包的文件
├── src // 源码目录
| |── api // api 接口文件
│ │ ├── advisory.js // 咨询相关的 api 接口
│ │ ├── product.js // 产品相关的 api 接口
│ │ ├── region.js // 地址相关的 api 接口
│ │ ├── token.js // token 相关的 api 接口
│ │ ├── user.js // 用户相关的 api 接口
| |── assets // 资源文件
│ │ ├── less // Less 文件
│ │ ├── font // 字体
│ │ ├── images // 图片
│ ├── components // 公共组件
│ │ ├── AdvisoryList.vue // 商品咨询列表组件
│ │ ├── Banner.vue // 轮播图组件
│ │ ├── CartHead.vue // 购物车页上的头部组件
│ │ ├── CateMenu.vue // 分类菜单组件
│ │ ├── CateShowProduct.vue // 商品分类页的商品展示组件
│ │ ├── ChangePage.vue // 翻页组件
│ │ ├── ChangeProductNum.vue // 改变商品数量组件
│ │ ├── CollSite.vue // 收藏网页组件
│ │ ├── DeliveryInfo.vue // 送货信息组件
│ │ ├── GoTop.vue // 回到顶部按钮组件
│ │ ├── IndexShowProduct.vue // 网站首页的商品展示组件
│ │ ├── InvoiceInfo.vue // 发票信息组件
│ │ ├── LoginHead.vue // 登录页的头部组件
│ │ ├── NavBar.vue // 导航栏组件
│ │ ├── OrderSett.vue // 订单结算组件
│ │ ├── PayMethod.vue // 支付方式组件
│ │ ├── ProductCate.vue // 商品分类组件
│ │ ├── ProductCateNav.vue // 商品分类导航组件
│ │ ├── ProductComment.vue // 商品评价组件
│ │ ├── ProductFilter.vue // 商品筛选组件
│ │ ├── ProductImage.vue // 商品图片组件
│ │ ├── ProductIntro.vue // 商品介绍组件
│ │ ├── ProductPosition.vue // 商品位置组件
│ │ ├── ProinfoNavBar.vue // 商品信息展示页的导航栏组件
│ │ ├── ProinfoProductList.vue // 商品信息展示页的商品列表组件
│ │ ├── ReceiveInfo.vue // 收货信息组件
│ │ ├── RegisterHead.vue // 注册页的头部组件
│ │ ├── SelectAddress.vue // 地址选择组件
│ │ ├── SelectColor.vue // 颜色选择组件
│ │ ├── SelectProductList.vue // 商品选择页的商品列表组件
│ │ ├── SelectShowProduct.vue // 商品选择页的商品展示组件
│ │ ├── SelectStyle.vue // 商品规格选择组件
│ │ ├── ShowProinfo.vue // 商品信息展示组件
│ │ ├── SiteFoot.vue // 脚部组件
│ │ ├── SiteHead.vue // 头部组件
│ │ ├── TopBar.vue // 顶部通栏组件
│ │ └── UserPosition.vue // 用户位置组件
| |── config
| │ └── index.js // 配置文件
| |── filter
| │ └── index.js // 过滤器文件
| |── libs
│ │ ├── api.request.js // api 请求
│ │ ├── axios.js // axios 配置
| │ └── util.js // 常用功能
│ ├── router
│ │ ├── index.js
│ │ └── routers.js // 项目路由
│ ├── store
│ │ ├── module
│ │ │ └── user.js // 用户状态
│ │ ├── getters.js
│ │ └── index.js // 状态管理
│ ├── views
│ │ ├── error-page // 错误页
│ │ │ ├── 401.vue // 401 页
│ │ │ ├── 404.vue // 404 页
│ │ │ ├── 500.vue // 500 页
│ │ │ ├── back-btn-group.vue
│ │ │ ├── error-content.vue
│ │ │ └── error.less // 错误页的样式
│ │ ├── cart.vue // 购物车和商品结算页
│ │ ├── cate.vue // 商品分类页
│ │ ├── index.vue // 网站首页
│ │ ├── login.vue // 登录页
│ │ ├── proinfo.vue // 商品信息展示页
│ │ ├── register.vue // 注册页
│ │ └── select.vue // 商品选择页
│ ├── App.vue
│ ├── main.js
├── tests // 自动化测试
├── .babelrc // babel编译的配置
├── .editorconfig // 编辑器的配置
├── .eslintignore // 设置忽略做语法检查的文件
├── .eslintrc.js // 设置ESLint语法检查的规则
├── .gitignore // 提交到git上时，忽略提交的文件和文件夹
├── .postcssrc.js // 自动加载配置为PostCSS
├── package-lock.json
├── package.json // 项目配置文件
└── vue.config.js // vue 配置文件
لتكوين خادم موقع الويب، يرجى الانتقال إلى مشروع خادم شبكة التجارة الإلكترونية: https://github.com/meishadevs/store-node
عندما يكون عنوان الخادم الخاص بك مختلفًا عن عنوان الخادم الذي قمت بتعيينه، يمكنك تعديل ملف Index.js ضمن srcconfig
export default {
// token 在 Cookie 中存储的天数，默认 1 天
cookieExpires: 1,
// api 请求基础路径
baseUrl: {
dev: 'http://localhost:8002',
pro: 'http://localhost:8002'
},
// 淘宝网商品搜索 url
taobaoUrl: 'https://suggest.taobao.com/sug?q=',
// 百度搜索 url
baiduUrl: 'http://www.baidu.com/s',
// 默认打开的首页的路由 name 值，默认为 home
homeName: 'home'
};
