首页 > 编程语言 >如何使用Visual Studio 2022创建基本Vue.js.Web应用程序

如何使用Visual Studio 2022创建基本Vue.js.Web应用程序

时间:2023-12-07 16:56:34浏览次数:36  
标签:Web vue 项目 创建 js 点击 Vue

最近接了个物联网项目,需要用到    VUE Ant-Design  对于 vue 没有概念  只能查找相关  vue.js 的知识。 

了解vue.js 的 前提条件  是要对   HTML +CSS +Jscript 有一定的知识储备。

所以 又去看了看 对应的三剑客(HTML +CSS +Jscript)。

跟着 vue.js 官网学习了一下, 就要开始 用 宇宙最强IDE --> vs2022  来简单操作一下。

然后发现了 问题是,我使用vs2022 从来没有 创建过 vue.js 的新项目,因为我是个 小菜鸡。 哈哈哈哈。 

开始进去正题。

一、首先对于编译器IDE 来讲 ,你要选择有对应的版本,工具。
   1.第一次下载vs后,并没有下载对应的bs的应用工具 也没有关系。
     点击 vs  标题栏   -- 工具   ---获取工具和功能(T)

 确定是 22版本,点击 修改按钮。

然后查看(Node.js开发)是否勾选

(没有勾选,就勾选上)

 

 安装完成后打开VS2022

 如果是第一次用的话,就和我的页面是差不多的,左侧项目栏里没有 vue.js 的项目

可以在搜索栏中填写   vue.js  会出现这样 ,在右侧 会出现 搜索结果。

 

 选择好要创建的目标项目,点击下一步

创建完成后点击左下角的输出

 创建完成后点击左下角的输出

对应着下面官网 操作  Npm

然后点击下拉框选择Npm然后等待命令执行完毕

VUE 官网:快速上手 | Vue.js (vuejs.org) 第三章节  
 

 点击生成解决方案/ 启动/ Web服务器

 出现了命令 错误 ,这是因为目前 环境为白板,需要个人配置环境。

这个属于正常情况,需要右键你的项目

点击在此处打开命令提示符

 

 在黑色命令窗体中  输入下面这 一个 指令
npm  install vue   

这是安装最新稳定版本的VUE

回车 ,等待它自己下载安装完成 

 

 下载完成后如果 如图所示的话,

 还需要输入
npm audit fix --force

意思是

npm审核修复-强制。

 

 修复完之后,还是有4个中等严重漏洞,我找了对应的方案,目前 没有找到完美的解决方案。   这个在后期开发的过程中,可能没有 某些提示符。到时候遇到了在解决吧。

点击项目运行

 项目可以跑起来了, 说明  环境配置成功

!!!   大工告成。

 

课下,研究下漏洞的解决方案。

Vue.js 潜在问题可通过 –fix 选项修复|极客教程 (geek-docs.com)

标签:Web,vue,项目,创建,js,点击,Vue
From: https://www.cnblogs.com/ZJ-CN/p/17881993.html

相关文章

  • 基于vue2开发的html5页面实现微信分享卡片(微信好友+朋友圈+qq好友+qq空间)
    首先附上文档链接:1.微信官方文档:https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/JS-SDK.html#1112.免费生成二维码的草料官网:https://cli.im/text/other 需求:在浏览器分享链接时携带用户id(因为是拉人活动,需要给用户积分),并且在微信中分享为卡片模式 具体......
  • vue3组件通信Props()
    vue3组件通信父传子defineProps()在使用 <scriptsetup> 的单文件组件中,props可以使用 defineProps() 宏来声明://父<HelloWorldmsg="Youdidit!"/><!--根据一个变量的值动态传入-->//<BlogPost:title="post.title"/>//子<scriptsetup>//写法1......
  • vue中孙子调用爷爷组件的方法怎么调用?
    使用Vue的provide和inject来实现跨层级的组件通信。provide允许一个祖先组件(爷爷组件)提供数据,而inject允许子孙组件(孙子组件)在任意层级注入这个数据。通过这种方式,你可以在孙子组件中访问到爷爷组件提供的方法。以下是一个简单的例子://在爷爷组件中提供方法exportdefault......
  • 实验四 Web服务器1-socket编程
    实验四Web服务器1-socket编程基于华为鲲鹏云服务器CentOS中(或Ubuntu),使用LinuxSocket实现:1.time服务器的客户端服务器,提交程序运行截图2.echo服务器的客户端服务器,提交程序运行截图,服务器把客户端传进来的内容加入“服务器进程pid你的学号姓名echo:”返回给客户端3.......
  • 构建一个语音转文字的WebApi服务
    构建一个语音转文字的WebApi服务简介由于业务需要,我们需要提供一个语音输入功能,以便更方便用户的使用,所以我们需要提供语音转文本的功能,下面我们将讲解使用Whisper将语音转换文本,并且封装成WebApi提供web服务给前端调用。创建项目第一步打开Vscode,选择一个目录作为工作空间,然......
  • a-table(AntDesign Vue)实现表格行上下拖动排序
    参考链接:https://blog.csdn.net/song_de/article/details/125218350https://blog.csdn.net/m0_61342618/article/details/132556739?utm_medium=distribute.pc_relevant.none-task-blog-2defaultbaidujs_baidulandingword~default-1-132556739-blog-125218350.235v39pc_releva......
  • 实验四 Web服务器1-socket编程
    time服务器time客户端echo服务器echo客户端......
  • 实验四 Web服务器2
    基于华为鲲鹏云服务器CentOS中(或Ubuntu),使用LinuxSocket实现:1.Web服务器的客户端服务器,提交程序运行截图2.实现GET即可,请求,响应要符合HTTP协议规范3.服务器部署到华为云服务器,浏览器用本机的4.把服务器部署到试验箱。(加分项)Web服务器代码(wbs.c)#include<stdio.h>#incl......
  • 小说网站|基于Springboot和Vue实现在线小说阅读网站
     作者简介:Java领域优质创作者、CSDN博客专家、CSDN内容合伙人、掘金特邀作者、阿里云博客专家、51CTO特邀作者、多年架构师设计经验、腾讯课堂常驻讲师主要内容:Java项目、Python项目、前端项目、人工智能与大数据、简历模板、学习资料、面试题库、技术互助收藏点赞不迷路 关注......
  • 实验四 Web服务器1-socket编程
    基于华为鲲鹏云服务器CentOS中(或Ubuntu),使用LinuxSocket实现:1.time服务器的客户端服务器,提交程序运行截图3.服务器部署到华为云服务器,客户端用Ubuntu虚拟机。time服务器代码(tms.c)#include<stdio.h>#include<stdlib.h>#include<string.h>#include<unistd.h>#include......