本地运行github上的vue2.0仿饿了么webapp项目

在vue刚刚开始流行的时候,大多数人学习大概都见到过这样的一个项目吧,可以作为学习此框架的一个模板了

图片.png

github源码地址:https://github.com/RegToss/Vue-SPA 课程教程:http://coding.imooc.com/class/74.html

首先搭建好vue的运行环境

1:安装node

端开发框架和环境都是需要 Node.js ,先安装node.js开发环境,vue的运行是要依赖于node的npm的管理工具来实现,下载https://nodejs.org/en/,安装完成之后,打开cmd开始输入命令。(我用的是win10系统,所以需要管理员权限,右键点击以管理员身份运行cmd),不然会出现很多报错。

image

2:查看node的版本号

下载好node之后,以管理员身份打开cmd管理工具,,输入 node -v ,回车,查看node版本号,出现版本号则说明安装成功。

输入命令: node -v

image

3:安装淘宝npm镜像

由于npm是国外的,使用起来比较慢,我们这里使用淘宝的cnpm镜像来安装vue. 淘宝的cnpm命令管理工具可以代替默认的npm管理工具。

输入命令:npm install -g cnpm --registry=https://registry.npm.taobao.org

image

4:安装全局vue-cli脚手架

淘宝镜像安装成功之后,我们就可以全局vue-cli脚手架,输入命令:cnpm install --global vue-cli 回车;验证是否安装成功,在命令输入vue,出来vue的信息,及说明安装成功;

输入命令:cnpm install --global vue-cli

image


准备就绪,开始步骤

1:从github上下载此项目,放在E盘里面备用

图片.png

2:进入代码根目录安装依赖:

npm install --save-dev

图片.png

3:运行项目

$ npm run dev

图片.png

在浏览器打开:http://localhost:8080

图片.png

4:发布代码:

    $ npm run build

发布完代码后会生成dist目录,保存着项目的所有可运行的代码。

图片.png


原文作者:祈澈姑娘 技术博客:https://www.jianshu.com/u/05f416aefbe1 90后前端妹子,爱编程,爱运营,爱折腾。 坚持总结工作中遇到的技术问题,坚持记录工作中所所思所见,欢迎大家一起探讨交流。

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

发表于

我来说两句

0 条评论
登录 后参与评论

相关文章

来自专栏腾讯移动品质中心TMQ的专栏

手机管家PiTest插件辅助测试方法分享

背景 你是否遇到过这样的测试场景: 垃圾需要达到2G! Wifi必要有有风险! CPU占用率达到70%以上! 日流量使用占用套餐的一半! 你的QQ必须要有风险...

21660
来自专栏Ksher

Kubernetes的服务网格(第4部分):通过流量切换持续部署

翻译人:Ksher,该成员来自云+社区翻译社

40680
来自专栏腾讯云服务器团队的专栏

腾讯云 CVM 标签实践分享

腾讯云主机 CVM 目前也已经接入标签的功能,且相应的 CAM 能力也已经支持。本文将模拟实际用户场景来做一个实践分享。

11.4K340
来自专栏编程

从w命令开始,系统状态命令哪个最强大?哪个你最熟悉?

最快的时间内,通过不同命令对Linux系统状态的把控,也是运维的基本功。今天一起来汇总一下,看看都有哪些。 1 使用w查看系统负载 相信所有的linux管理员最...

21080
来自专栏维C果糖

Hello World · GitHub 指南

简介 Hello World 项目是计算机编程历史中悠久的传统。在我们学习新知识的时候,她也是一个简单的练习。现在,就让我们一起了解 GitHub 吧! 你将学...

19390
来自专栏北京马哥教育

GitHub 使用详解

本文大纲 GitHub简介 注册GitHub账号 配置GitHub 使用GitHub 参与GitHub中其它开源项目 注,GitHub官网:https://g...

42160
来自专栏拂晓风起

node.js cluster多进程、负载均衡和平滑重启

37630
来自专栏HTML5学堂

2016,NodeJS干货来袭

HTML5学堂:随着时代的发展,JS的地位已经越来越高,NodeJS也是从萌芽开始,茁壮成长~这篇文章我们主要借助weinre这个NodeJS工具,讲解Node...

42370
来自专栏前端杂货铺

提升node.js中使用redis的性能

某基于node.js开发的业务系统向外提供了一个dubbo服务,提供向第三方缓存查询、设置多项业务数据并聚合操作结果。在QPS达到800时(两台虚拟机,每台机器...

31120
来自专栏PHP在线

PHP安全:session劫持的防御

点击蓝色小字关注 session 数据暴露 会话数据常会包含一些个人信息和其它敏感数据。基于这个原因,会话数据的暴露是被普遍关心的问题。一般来说,暴露的范围不会...

38980

扫码关注云+社区

领取腾讯云代金券