如何运行vue项目(维护他人的项目)

假如你是个小白,在公司接手他人的项目,这个时候,该怎么将这个项目跑通?

前提:
首先,这个教程主要针对vue小白,并且不知道安装node.js环境的。言归正传,下面开始教程:在维护项目之前,需要把所有的环境搭建好,这里我就不多说了,看这篇就够了:十分钟上手-搭建vue开发环境(新手教程)https://www.jianshu.com/p/0c6678671635

好了,再重复具体不嫌麻烦的把步骤操作一遍,做技术就得孰能生巧,一遍又一遍不断的重复
如下:

1:安装cnpm
由于npm有些资源被屏蔽或者是国外资源的原因,经常会导致用npm安装依赖包的时候失败,所有我还需要npm的国内镜像---cnpm
在命令行中输入 npm install -g cnpm --registry=http://registry.npm.taobao.org

5640239-a3ab76ad1f3af216.png
图片.png

2:安装webpack
npm install webpack -g
webpack是一款模块加载器兼打包工具,它能把各种资源,例如JS(含JSX)、coffee、样式(含less/sass)、图片等都作为模块来使用和处理。 webpack 的核心是 依赖分析,把依赖分析出来了,其他都是细枝末节。

5640239-11f8975550557e33.png
图片.png

3:安装vue-cli
cnpm install vue-cli -g
vue-cli是vue.js的脚手架,用于自动生成vue.js+webpack的项目模板
,这个过程会耗时十几秒,等走完就好;好了,到此整个环境就搭建好了

5640239-9cafb07521633db8.png
图片.png

4:cd /项目名称
下面就是运行项目了,cd /项目名称,我的文件放在D盘,所以先进入d盘,再进入项目。
cd ShopApp

5640239-a3154d4d56617f19.png
图片.png

5:npm install
进入项目之后安装依赖,安装成功

5640239-17a1e48be173a9a9.png
图片.png

注意:在这一步可能会出现这样的错误;因为你打开的是别人的项目,项目之中肯定有 node_modules模块,那么先删除掉,在执行npm install命令

5640239-43e9fd7c4fcf0606.png
图片.png

如果出现了,请参考这篇文章解决:https://www.jianshu.com/p/5e62d852babc

6:npm run dev
一切准备就绪,启动项目
npm run dev

5640239-426a16cec5693a83.png
图片.png

7:自动启动浏览器就会打开项目了
在浏览器中输入http://localhost:8080/#/;进入项目首页
若是要访问其他页面,直接在#后面加上组件名称即可:例如http://localhost:8080/#/adjustIntegral

原文作者:祈澈姑娘
技术博客:https://www.jianshu.com/u/05f416aefbe1

90后前端妹子,爱编程,爱运营,爱折腾。
坚持总结工作中遇到的技术问题,坚持记录工作中所所思所见,欢迎大家一起探讨交流。

转载于:https://www.cnblogs.com/wangting888/p/9701379.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/397311.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

进程操作

2019独角兽企业重金招聘Python工程师标准>>> 一、创建一个进程 进程是系统中最基本的执行单位。Linux系统允许任何一个用户进程创建一个子进程,创建之后,子进程存在于系统之中并独立于父进程。 关于父进程与子进程这两个概念,除了…

计算机硬件发展的特点有哪些,简述计算机的发展历程及各代计算机的特点。

满意答案Karen0491推荐于 2017.11.25采纳率:40% 等级:6已帮助:608人世界上第一台计算机是1946年问世的,根据计算机的性能和软硬件技术,将计算机发展划分成以下几个阶段:①第一阶段:电子管计算…

电饼锅的样式图片价格_进口珐琅铸铁锅专场,精致小厨娘们来康康!

两个月前,小灰兔我写了《10个高颜值居家好物,让你在朋友圈万众瞩目!》一文,曾有小伙伴私信说这张图简直就是梦想中厨房的亚子强烈同意!!!有多少女孩子,看到颜值炒鸡高的锅路都走不动…

在UITouch事件中画圆圈-iOS8 Swift基础教程

这篇教程主要内容展示如何利用Core Graphics Framework画圆圈,当用户点击屏幕时随机生成不同大小的圆,这篇教程在Xcode6和iOS8下编译通过。 打开Xcode,新建项目选择Single View Application,Product Name填写iOS8SwiftDrawingCirclesTutorial,Organization Name和Organization …

浏览器兼容性问题

转载于:https://www.cnblogs.com/python-machine/p/9406084.html

有人在远程使用计算机是什么意思,如何远程控制计算机,计算机远程控制有什么用途...

对于每个人来说,计算机都是至关重要的家用电器. 因为使用计算机可以使我们的业余生活丰富多彩. 随着Internet的普及,越来越多的用户开始学习自己使用计算机. 但是,操作中仍然存在很多问题,只要每个人都学会了远程控制,…

图学java基础篇之IO

java io体系 如图可以看出,java的io按照包来划分的话可以分为三大块:io、nio、aio,但是从使用角度来看,这三块其实揉杂在一起的,下边我们先来概述下这三块: io:主要包含字符流和字节流,我们常用…

boot界面上下键调节键不能动_为什么电脑一开机就自动进入BIOS界面

电脑故障的问题表现形式很多,比如说为什么电脑蓝屏,为什么电脑一开机就自动进入BIOS界面等。这些问题往往另很多网友不知所措。今天小编就针对电脑一开机就自动进入BIOS界面的问题,教下大家具体的解决方法。1、你的BIOS电池没有电了。解决方法…

句子相似度--余弦相似度算法的实现

1、余弦相似度余弦距离,也称为余弦相似度,是用向量空间中两个向量夹角的余弦值作为衡量两个个体间差异的大小的度量。余弦值越接近1,就表明夹角越接近0度,也就是两个向量越相似,这就叫"余弦相似性"。 上图两…

红帽436——HA高可用集群之概念篇

一、集群概念:集群:提高性能,降低成本,提高可扩展性,增强可靠性,任务调度室集群中的核心技术。集群作用:保证业务不断 集群三种网络:业务网络,集群网络,存储网络 二、集群三种类型:…

按季度分类汇总_2019年纯碱行业相关上市公司季报 与半年报情况汇总

2019年纯碱行业相关上市公司季报与半年报情况汇总经百川盈孚统计,目前纯碱行业相关上市公司共计11家(包含三家ST股),已经全部公布2019年一季度报告。2019年上半年度报告仅五家公司公布,其中包含:大连大化、山东海化、华昌化工、湖…

sapmto生产模式配置及操作详解_硬岩制砂线怎么设计?300t/h的生产流程与设备配置详解...

点击上方“蓝字”关注我们说到硬岩,花岗岩、辉绿岩都不陌生,关于花岗岩的生产线配置小编曾介绍过,感兴趣的可直接点阅:《硬质岩破碎很发愁?从原料到成品,看花岗岩的破碎制砂生产线配置》《年产300万t花岗岩…

公交卡软件测试思路,中国移动NFC专用SIM卡测试过程介绍

近期,通讯运营商在NFC的应用领域迈出了一大步,消费者在北京乘坐地铁、公交以及其他支持市政一卡通消费的场所均可进行手机支付。接下来就从办卡开始,为大家详细介绍一下中国移动NFC手机钱包的实测过程。办理手机NFC支付业务想要刷手机消费除了…

青年教师大讲堂 计算机,浙海大青年教师大讲堂之船机学院“知识改变命运”...

原标题:浙海大青年教师大讲堂之船机学院“知识改变命运”10月28日上午,由校团委主办,船舶与机电工程学院团委承办的青年博士教师大讲堂系列活动之“知识改变命运”在长峙校区杨存国一号报告厅举行。本次讲座由船舶与机电工程学院青年博士石学…

深入浅出分布式文件系统MogileFS集群

一,简介 MogileFS是一款开源的分布式文件存储系统,由LiveJournal旗下的Danga Interactive公司开发。Danga团队开发了包括 Memcached、MogileFS、Perlbal 等多个知名的开源项目。目前MogileFS的日益成熟使用此解决方法的公司越来越多,例如日…

计算机的控制面板打不开,控制面板打不开,教您控制面板打不开怎么办

最近有些不少的小伙伴向小编反映说,控制面板突然出现了打不开的情况,那么遇到这种情况该怎么办呢?其实控制面板打不开很有可能是因为系统文件损坏造成的。今天,小编就来把打不开控制面板的解决方法分享给你们。其实控制面板是我们…

【算法题】Multiples of 3 and 5

Multiples of 3 and 5 原题 题意如下: 找出N以内的3和5的倍数的和。 思路 1、刚看到觉得好弱智,直接遍历一遍不就OK了吗?但是第2和第3个测试用例报了TLE,超时。 2、然后想不出来了,搜了一下,发现有一个类似…

PIL简单图片处理(上)

自己看了下python,本来想照教程上一点一点学的,学了一会发现好没劲(教程本身质量很好),学python就是为了好玩,为什么还这么按部就班勒?果断google下python的爬虫(开始目的是这个&…

方舟服务器制作修改,ARK方舟:生存进化服务器禁止物品制造的修改方法

ARK方舟:生存进化服务器禁止物品制造的修改方法代码对应的文件目录:文件:Game.ini框架:[/script/shootergame.shootergamemode]例如禁用C4遥控器代码为:ConfigOverrideItemCraftingCosts(ItemClassString"PrimalItem_WeaponC4_C",BaseCraftingResourceRequirements((…

SQL Server 2008空间数据应用系列四:基础空间对象与函数应用

SQL Server 2008空间数据应用系列四:基础空间对象与函数应用 原文:SQL Server 2008空间数据应用系列四:基础空间对象与函数应用友情提示,您阅读本篇博文的先决条件如下: 1、本文示例基于Microsoft SQL Server 2008 R2调测。 2、具…