Vue可视化项目搭建

news2024/10/6 4:04:31

安装Nodejs

全局下载Vue项目脚手架 

创建项目

运行项目

项目初始化


安装Nodejs

        下载地址:https://nodejs.org/zh-cn/ 

        下载完成之后一路点击下一个安装 

全局下载Vue项目脚手架 

        进入开始菜单以管理员身份运行命令提示符 

         输入更换镜像源为淘宝源

npm config set registry https://registry.npm.taobao.org

         在命令提示符中输入以下命令,清除npm缓存

npm cache clean --force

        下载安装cli  

npm install -g @vue/cli

        检查是否安装成功 

创建项目

        创建的方式,在控制台输入:

vue create 项目名

        输入完成之后会弹出设置选项

        选择vue版本为自定义 

        选择项目中所需的模块

        选择vue版本为3.x

        默认选择只报错和提醒

        选择保存校验格式 

        选择保存位置为默认的独立文件 

        输入N不保存当前配置 

 

        查看创建成功

运行项目

         把cmd路径切换到项目中,输入命令npm run serve启动项目

         本地访问地址查看

项目初始化

         直接删除views目录下的文件

         新建一个自己的vue文件

         将基本的vue页面框架创建出来

         修改下来之后发现运行报错(因为删除了文件并且携带路由模块)

        到路由模块中移除Home的相关内容

         将about关联到自己刚才新建的vue页面文件

        配置vue的路由重镜像

 进入页面查看

        到App.vue文件下将样式清空 

         到这里所有的样式已经清除了 剩下就可以自己创建自己的页面

如果需要停止项目运行则在控制台输入ctrl+C 输入Y停止该项目运行

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

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

相关文章

java线程屏障CyclicBarrier

CyclicBarrier允许一组线程在达到一个公共的屏障点时相互等待。它在涉及固定大小的线程组、并且这些线程必须相互等待的程序中非常有用,CyclicBarrier可以在等待的线程被释放后被重用。 构造方法 CyclicBarrier(int parties) 创建一个新的屏障并设置将要访问这个…

问卷调查样本量的确定方法

我们在进行问卷调查的时候,问卷的收集数量是重要的流程之一。问卷数量取决于几个因素,包括研究的目的和研究的类型。接下来,我们就聊一聊怎么确定所需的调查问卷数量。 1、确定研究目标。 确定所需问卷数量的第一步是明确研究目标。这一步是…

jar包依赖冲突该怎么解决(IT枫斗者)

jar包依赖冲突该怎么解决(IT枫斗者) maven jar包依赖规则 间接依赖路径最短优先一个项目依赖了a和b两个jar包,其中a-b-c1.0,d-e-c1.0,由于c1.0路径最短,所以项目最后使用的jar包是c1.0pom文件中申明顺序优先有人就问…

使用三轴XYZ平台绘制空心字

1. 功能说明 本文示例将实现R312三轴XYZ平台绘制“机器时代”空心字的功能。 2. 电子硬件 在这个示例中,采用了以下硬件,请大家参考: 主控板 Basra主控板(兼容Arduino Uno) 扩展板 Bigfish2.1扩展板 SH-ST步进电机扩展…

2023年最系统的自动化测试,测试开发面试题,10k以下不建议看

鉴于现在严峻的就业形势,千万大学生即将出新手村,今天给大家打包好了2023最能避免薪资倒挂的《面试圣经》。不经一番寒彻骨,怎得梅花扑鼻香。这份面试题,与君共勉! 一、开场白 Q:简单自我介绍一下吧 Q:项…

Bots攻击威胁石油石化企业 瑞数动态安全实现从“人防”到“技防”

近日,中国石油石化企业信息技术交流大会暨油气产业数字化转型高峰论坛在京召开。本届大会由中国石油学会、中国石油、中国石化、中国海油、国家管网、国家能源、中国中化、中国航油、延长石油、中国地质调查局等单位共同主办。 作为我国石油石化行业的盛会&#xf…

论坛现场回顾:维视教育的新工科人才培养 「最佳实践 」

全国高校电子信息类专业教学论坛隆重召开 由教育部高等学校电子信息类专业教学指导委员会主办,苏州大学、清华大学出版社承办的“全国高校电子信息类专业教学论坛”于2023年4月14日-16日在江苏省苏州市隆重开幕,维视教育作为电子信息类教学指导委员会战略…

最优化方法Python计算:连续函数的单峰区间计算

我们知道,闭区间上的一元连续函数必在区间上取得最大值和最小值。实践中我们需要能数值地确定含有 f ( x ) f(x) f(x)的唯一最优解 x 0 x_0 x0​的区间 [ a , b ] [a,b] [a,b]。这里介绍寻求连续函数 f ( x ) f(x) f(x)在一点 x ∗ x^* x∗附近单峰区间的包围算法及…

飞桨paddlespeech语音唤醒推理C实现

上篇(飞桨paddlespeech 语音唤醒初探)初探了paddlespeech下的语音唤醒方案,通过调试也搞清楚了里面的细节。因为是python 下的,不能直接部署,要想在嵌入式上部署需要有C下的推理实现,于是我就在C下把这个方…

Android Stuido中修改项目SDK版本号

通过Android Studio创建项目时,只能选择项目支持的最低SDK版本号,而无法选择当前编译使用的版本号,如图1所示。 图1 选择项目支持的最小版本号 而编译项目的SDK版本号默认是Android Studio安装的最新SDK。如果不想使用最新SDK来编译项目&…

C++入门(3)

C入门 1.auto关键字(C11)1.1. 类型别名的思考1.2. auto简介1.3. auto使用情景1.4. auto的使用细则1.5. auto不能推导的场景 2.函数内联2.1. 问题提出2.2. 概念(关键字——inline)2.3. 特性2.4. 面试题 3. 基于范围的for循环(C11)3…

Python 基础(八):流程控制语句

❤️ 博客主页:水滴技术 🌸 订阅专栏:Python 入门核心技术 🚀 支持水滴:点赞👍 收藏⭐ 留言💬 文章目录 一、条件语句1.1、if1.2、if...else...1.3、if...elif...else... 二、匹配语句2.1、ma…

亚马逊、ebay、temu如何提升产品点击率?测评自养号解析

产品点击率对于店铺销售额的影响至关重要,尤其是在竞争越来越激烈的市场环境中,想要有销量和转化,提高产品listing点击率成为了非常关键的一环。 1. 产品主图 顾客浏览产品时,第一眼看到的就是主图,一张优质的主图更容…

Scala之面向对象

目录 Scala包: 基础语法: Scala包的三大作用: 包名的命名规范: 写包的好处: 包对象: 导包说明: 类和对象: 定义类: 封装: 构造器: 主从…

将项目部署到服务器上,并且使用JMeter测试项目性能

1、前提条件 首先呢,你要有一个有一个项目,并且打包成jar包。然后你要有一台服务器,你可以登录阿里云(国内社区)然后买按量付费的服务用一下,其实服务器就像虚拟机一样,linux命令执行。但是Cen…

操作系统的结构与功能流程

一、用户态和内核态 用户态可以理解为用户模式,内核态理解为内核模式 二、功能流程举例 假设你是一名顾客在一家餐厅用餐,餐厅有一个厨师负责烹饪食物,而你作为顾客只能在餐厅的就餐区域内进行点餐、享用餐点。这里就可以将就餐区域看作用户…

【基于视觉的分割】语义分割初探索:一些经典和先进的算法

写在前面: 有很长时间没有更新学习了,因为在忙着做试验写毕业论文。但是,学习不能停止,从今天开始,换成语义分割方向进行深入学习,有兴趣的小伙伴可以和我一起讨论,也欢迎才进入这个方向学习的…

【Grafana】連接mssql並圖表顯示

【Grafana】連接mssql並圖表顯示 1. 函數2. Demo2.1 Query2.2 Query 3. Awakening1.1 Big Data -- Postgres 1. 函數 Macro exampleReplaced by$__time(dateColumn)An expression to rename the column to time. For example, dateColumn as time$__timeEpoch(dateColumn)An e…

改变思想,拥抱毒瘤,让公司走的更远

牛B的人物,早已经厌倦了中英文混杂,他们更进一步,使用中英文缩写,对普通人进行降维打击。更厉害的,造就新的名词,并科普出去。 有几项技术,我从心底里鄙视和厌恶,但每次在技术方案中…

Cursor IDE一个GPT4人工智能自动程序编辑器

让我们来了解一下Cursor IDE是什么。Cursor IDE是一个新型的编程工具,可以通过它生成、编辑以及与人工智能进行交互分析代码。官方网站上的三个单词“Build Software. Fast.”(快速构建软件)以及“Write, edit, and chat about your code wit…