vue项目编译与运行-程序员宅基地

技术标签: 前端开发  vue  

vue作为一种前端框架,在当前项目中具有很大的应用场景。那么从码云或github上下载的vue项目在本地如何看效果呢,这里记录一下搭建的过程,方便之后的查看。之前本地电脑还安装了node.js的环境,这里不再说明,具体可以参考网上的教程。

1、安装npm

有时候用npm下载依赖,速度较慢,可能会出现失败,可以安装国内的镜像如cnpm,安装npm的命令如下。

npm install -g cnpm --registry=http://registry.npm.taobao.org
// 若运行失败的话 可以确认一下npm的版本
npm -v
// 可以试试升级为最新的版本
npm install -g npm
2、安装模块管理器 webpack

为了方便对项目中的各种资源文件,如js,image等进行管理,可以安装webpack模块加载器。安装命令如下。

npm install webpack -g
3、安装脚手架 vue-cli

vue-cli 是vue的脚手架,通过安装它,可以轻松的创建新的应用程序而且可用于自动生成vue和webpack的项目模板。安装命令如下。

cnpm install vue-cli -g
// 查看版本
vue --version

安装成功后,vue的环境就安装好了,可以下载源码文件,尝试运行项目。

4、查看启动方式

对源码解压,在解压后源码文件夹的 package.json 文件中,可以看项目启动的方式,如 start : npm run dev,注意有些可能不是 dev
在这里插入图片描述
程序底层开始执行底层相当执行 dev后面的命令 webpack-dev-server --inline --progress --config build/webpack.dev.conf.js命令,执行命令生成一个 node_modules 文件夹,里面是下载的依赖信息。
在这里插入图片描述

注意:文件夹中已经存在node_modules文件夹,需要将其删除,重新下载,否则可能导致启动不成功!

5、浏览器打开

启动成功后,会自动跳转到登录页面,这样再运行后台的程序,就可以进行登录操作了。
在这里插入图片描述

参考博客

【1】https://blog.csdn.net/qq_44900944/article/details/98760857?utm_medium=distribute.pc_aggpage_search_result.none-task-blog-2allfirst_rank_v2~rank_v25-7-98760857.nonecase

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/u012190388/article/details/107722486

智能推荐

MyBatis拦截器的使用和设计原理_mybatis 写拦截器-程序员宅基地

文章浏览阅读1.3w次,点赞8次,收藏34次。使用拦截器Web开发中我们经常会碰到分页操作,一个项目中或许有多处使用到分页,这时如果Java后台使用MyBatis作为持久层,我们就可以使用MyBatis的拦截器功能来完成整个项目中多处的分页操作,减少代码的冗余。拦截器代码@Intercepts({@Signature(type=StatementHandler.class,method="prepare",args={Connection.cl_mybatis 写拦截器

docker-selinux 改为 container-selinux-程序员宅基地

文章浏览阅读233次。说明:Dan在2016年将docker-selinux相关的名字改为container-selinux,但是很多旧的资料和网上文章还是使用旧的名字,在工作这些资料中的名字会令人不解,本篇博客介绍了改名的原因以及名字的对应:原名现名docker_tcontainer_runtime_tdocker_exec_tcontainer_runtime_exec_tsvirt..._container-selinux

Mac OS 安装 MPI_macos如何安装gmx_mpi-程序员宅基地

文章浏览阅读1.1w次,点赞2次,收藏13次。1.官网下载http://www.open-mpi.org/software/ompi/v1.8/_macos如何安装gmx_mpi

传统后端程序不使用Node.JS依然要搞Element UI_不使用nodejs可以使用element吗-程序员宅基地

文章浏览阅读1.2k次,点赞6次,收藏8次。概述作为一个Java重度使用患者,后端程序员掌握一些前端知识是必备技能。Html、CSS、JS三大语言后端玩起来也得是溜得很,不过现在前端技术发展的速度简直做上了飞机,后端程序员自己首先要保障后端技术不被拉下,再想回头学学前端技术,没想到那趟飞机已经上天了。不得不说后端程序员普遍使用的ui界面都是比较丑,再看看现在各种前端页面靓的一匹。现阶段流行的UI框架典型的比如饿了么的Element、阿里的Ant Design等等。这些框架对于后端程序员使用话说不怎么友好,官方推荐安装Node.JS使用_不使用nodejs可以使用element吗

Bat语法-程序员宅基地

文章浏览阅读47次。1、 REM REM 是个注释命令一般是用来给程序加上注解的,该命令后的内容在程序执行的时候将不会被显示和执行。 例: REM 你现在看到的就是注解,这一句将不会被执行。 2、 ECHO ECHO 是一个回显命令主要参数有OFF和 ON,一般用ECHO message来显示一个特定的消息 。例: Echo off Rem 以上代表关闭回显即不显示所执行的命令 Echo 这个就是消息。 R...

RCNN,Fast RCNN-程序员宅基地

文章浏览阅读64次。https://towardsdatascience.com/deep-learning-method-for-object-detection-r-cnn-explained-ecdadd751d22

随便推点

PHP empty() is_null() isset()区别-程序员宅基地

文章浏览阅读113次。PHP empty() is_null() isset()区别

联合分布-程序员宅基地

文章浏览阅读2.2k次。作者:Vamei 出处:http://www.cnblogs.com/vamei 欢迎转载,也请保留这段声明。谢谢! 我之前一直专注于单一的随机变量及其概率分布。我们自然的会想将以前的结论推广到多个随机变量。联合分布(joint distribution)描述了多个随机变量的概率分布,是对单一随机变量的自然拓展。联合分布的多个随机变量都定义在同一个样本空间中。对于联合分布来_联合分布

chatgpt赋能python:Python中的逆序排列:什么是逆序排列?如何实现?_python字符串逆序是不是变成左开右闭原则了-程序员宅基地

文章浏览阅读347次。本文由chatgpt生成,文章没有在chatgpt生成的基础上进行任何的修改。以上只是chatgpt能力的冰山一角。作为通用的Aigc大模型,只是展现它原本的实力。对于颠覆工作方式的ChatGPT,应该选择拥抱而不是抗拒,未来属于“会用”AI的人。AI职场汇报智能办公文案写作效率提升教程 专注于AI+职场+办公方向。下图是课程的整体大纲下图是AI职场汇报智能办公文案写作效率提升教程中用到的ai工具。_python字符串逆序是不是变成左开右闭原则了

C语言listen()函数:等待连接_c listen-程序员宅基地

文章浏览阅读3.5k次。相关函数:socket, bind, accept, connect头文件:#include 定义函数:int listen(int s, int backlog);函数说明:listen()用来等待参数s 的socket 连线. 参数backlog 指定同时能处理的最大连接要求, 如果连接数目达此上限则client 端将收到ECONNREFUSED 的错误. Listen_c listen

Charles+Postman模拟接口请求_charles postman-程序员宅基地

文章浏览阅读8.3k次。为什么要写这篇文章呢,就是一个小点,我老忘,就在这里记录一下吧。不想多说废话,直接上正题吧,charles的配置我们就不说了,找度娘吧,charles的请求参数怎么能在postman上使用呢,可以看到上图是我抓的一个接口,以这个为例吧,最上面的是请求参数,我们直接吧请求参数放在POSTMAN的body里面,然后格式选择“JSON(application/json)”如上图所示,粘过来,输上请求的URL就直接可以模拟请求了,至于接下来不管是改参数还是写脚本断言呀,或是别的什么操作,就看你自己了。原谅_charles postman

配置Spring数据源 -程序员宅基地

文章浏览阅读483次。配置一个数据源 Spring在第三方依赖包中包含了两个数据源的实现类包,其一是Apache的DBCP,其二是 C3P0。可以在Spring配置文件中利用这两者中任何一个配置数据源。 DBCP数据源 DBCP类包位于 /lib/jakarta-commons/commons-dbcp.jar,DBCP是一个依赖 Jakarta commons-pool对象池机制的数据..._mysql.properties中username字体颜色怎么

推荐文章

热门文章

相关标签