QShop商城-快速开始-前端

工具准备

NodeJs

前端环境为NodeJs，下载地址：http://nodejs.cn/download/current/ 。 默认会用版本为Node 16,如找不到我已分享: https://pan.baidu.com/s/1yM2TysvkH0pD7NdAAeXcag 提取码: y9c5

visual studio code

下载最新版的vs code，用来作为前端的开发工具。

打开项目

打开目录3_PcAdmin双击zQShop.code-workspace,使用vsCode打开项目

修改配置

设置后端接口地址 打开 .env.dev ,部署时应该修改 .env.prod .如下图

安装依赖

安装依赖 终端=>新建终端=>输入npm install

运行前端

安装依赖后继续输入 npm run dev

启动后端,请查看上一章[快速开始(后端)]

启动成功后，使用浏览器访问http://localhost:8888/即可打开界面

部署前端

安装依赖后继续输入npm run build,生成dist文件

宝塔面板创建网站,将dist内文件上传至网站根目录即可,如下图

QShop商城-快速开始-前端的更多相关文章

  1. m_Orchestrate learning system---七、如何快速学好前端

    m_Orchestrate learning system---七.如何快速学好前端 一.总结 一句话总结:看视频啊,系统看视频啊 1.如何解决单词数字太长超出边界的问题? word-wrap 把编辑 ...

  2. Turtle Online：致力于打造超接地气的PC前端架构，组件+API，快速搭建前端开发

    架构创作初衷 每当新开一个项目时,都会绞尽脑汁去考虑采用哪种框架:requirejs/seajs.jquery/zepto.backbone.easeUI/Bootstrap/AngularJS……, ...

  3. 使用vue2.x+webpack+vuex+sass+axios+elementUI等快速搭建前端项目框架

    一.本文将分享如何快速搭起基于webpack+vue的前端项目框架,利用vue的自己的脚手架工具vue-cli搭建起基本的环境配置,再通过npm包管理工具引入相应的依赖来完善项目的各种依赖框架.下面是 ...

  4. H5商城，纯前端静态页面

    发布时间:2018-09-28   技术:jquery1.10.1+swipeSlide+jquery.mmenu+jquery.touchSwipe+cityinit   概述 纯手写H5商城,2年 ...

  5. 基于serverless快速部署前端项目到腾讯云

    腾讯云 COS 组件,可以快速部署静态网站页面到对象存储 COS 中,并生成域名供访问. 安装 首先要安装 serverless 组件 npm install -g serverless 在项目的根目 ...

  6. vue-element-admin改造接入后台，搭建有来商城youlai-mall后台前端管理平台

    一. 前言 本篇基于有来商城youlai-mall微服务项目,搭建后台前端管理平台,技术选型希望通过本篇文章你可以,技术解决方案选择了vue-element-admin.希望通过本篇文章你可以vue- ...

  7. 用 Docker 快速配置前端开发环境

    来源于:http://dockone.io/article/1714 今天是你入职第一天. 你起了个大早,洗漱干净带着材料去入职. 签了合同,领了机器,坐到工位,泡一杯袋装红茶,按下开机键,输入密码, ...

  8. 夺命雷公狗---DEDECMS----5快速入门之商城快速搭建实现快递方式和支付方式的显示

    我们现在用dedecms快速搭建一个商场,方法如下所示: 如此类推.写多几个栏目,效果 如下所示: 然后我们添加几个商品,记得要刷新下页面噢,不见见不到商品 添加成功后去看看效果如何: 出来了,但是如 ...

  9. 淘淘商城之springmvc前端控制器

    一.web.xml <?xml version="1.0" encoding="UTF-8"?> <web-app xmlns:xsi=&qu ...

  10. 快速了解前端开发HTML的正确姿势

    摘要:web前端开发(也称为客户端开发)主要是通过html,CSS和JavaScript等前端技术,实现网站在客服端的正确显示及交互功能. 一.web标准介绍 web标准: w3c:万维网联盟组织,用 ...

随机推荐

  1. MogDB学习笔记之 -- 了解pagewriter线程

    MogDB 学习笔记之 -- 了解 pagewriter 线程 本文出处:https://www.modb.pro/db/183172 在前面的 MogDB 学习系列中,我们了解了核心的 bgwrit ...

  2. k8s之存储卷local PV

    一.简介 local能够作为PV使用的本地存储卷. local卷插件用于将本地存储设备(如磁盘.分区或目录) 配置为卷. hostPath卷在Pod被重建后可能被调试至其它节点而无法再次使用此前的数据 ...

  3. setTimeout(fn, 0) // it works - JavaScript 事件循环 动画演示

    在前端代码中很经常看到使用 setTimeout(fn, 0),如下面代码所示,乍一看很多余,但是移除了可能会出现一些奇奇怪怪的问题.要解释这个就需要理解 事件循环(Event Loop),下面会通过 ...

  4. leetcode - 子数组最大平均值

    给定 n 个整数,找出平均数最大且长度为 k 的连续子数组,并输出该最大平均数. 示例: 输入:[1,12,-5,-6,50,3], k = 4 输出:12.75 解释:最大平均数 (12-5-6+5 ...

  5. 首次公开！阿里云开源PolarDB总体架构和企业级特性

    ​简介:在3月2日的阿里云开源 PolarDB 企业级架构发布会上,阿里云 PolarDB 内核技术专家北侠带来了主题为<PolarDB 总体架构设计和企业级特性>的精彩演讲. 在3月2日 ...

  6. Scheduled SQL： SLS 大规模日志上的全局分析与调度

    简介: 本文总结了大规模日志全局分析的需求,讨论SLS上现有的典型分析方案,并延伸到 SLS 原生数据处理方案,介绍 Schedueld SQL 功能与最佳实践. 大规模日志全局分析的需求 数据大规模 ...

  7. 模仿Spring实现一个类管理容器

    ​简介: 项目的初衷是独立作出一个成熟的有特色的IOC容器,但由于过程参考Spring太多,而且也无法作出太多改进,于是目的变为以此项目作为理解Spring的一个跳板,与网上的一些模仿Spring的框 ...

  8. 凭证管理揭秘：Cookie-Session 与 JWT 方案的对决

    概述 在上一篇文章我们聊完了授权的过程,在服务器对客户端完成授权之后,服务器会给客户端颁发对应的凭证,客户端持有该凭证访问服务端,服务器便能知道你是谁,你有什么权限等信息.这一章我们具体聊聊常见的凭证 ...

  9. 快速搭建Zookeeper和Kafka环境

    前言 由于项目需要涉及到zookeeper和Kafka的使用,快速做了一篇笔记,方便小伙伴们搭建环境. zookeeper 官方定义 What is ZooKeeper? ZooKeeper is a ...

  10. 程序员天天 CURD，怎么才能成长，职业发展的思考 ？

    前言 关于程序员成长的话题,我前面写过一篇文章 - 程序员天天CURD,职业生涯怎么发展的思考. 现在回头看,对程序员这个职业发展的认识以及怎么发展还是有一些局限性.有一句话是这么说的:人的成长就是不 ...